
:root{
  --bg:#FFFFFF; --ink:#1D1D1F; --muted:#6E6E73; --panel:#F5F5F7; --line:#D2D2D7; --link:#0066CC;
  --sky1:#EEF1EE;--sky2:#F8F6F1;--sun:#E9C77B;--far:#E1E4E1;--far2:#D3D8D4;--ink:#2B2B2D;--ochre:#DCC9A0;--sage:#B7C5B4;--blush:#E7D3CB;--terra:#B8674C;--terra2:#9A4F38;--ivory:#F7F3EA;--shut:#4C6A58;--shut2:#3C5647;--shadow:#5E5A55;--wood:#8A6A4E;--lamp:#F0CD82;--stone:#E8E3D9;--stone2:#D6CFC2;--glass:#C9D6D3;--lawn:#A9B89A;--water:#8FB9B8;--water2:#6E9E9F;--leaf1:#3F5E4A;--leaf2:#56785F;--leaf3:#6F9277;--bark:#5B4A3C;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--bg:#000;--ink:#F5F5F7;--muted:#A1A1A6;--panel:#161617;--line:#424245;--link:#2997FF;;--sky1:#0D1418;--sky2:#1A1E22;--sun:#E9C77B;--far:#1E2327;--far2:#2A3035;--ink:#0A0A0B;--ochre:#6B5E48;--sage:#4F5B4E;--blush:#6A5A55;--terra:#6E3E2E;--terra2:#552F22;--ivory:#8E877A;--shut:#2E4034;--shut2:#24332A;--shadow:#141312;--wood:#4A3A2C;--lamp:#F0C06A;--stone:#4A463F;--stone2:#3A362F;--glass:#253033;--lawn:#2B3527;--water:#28413F;--water2:#1C302F;--leaf1:#223428;--leaf2:#2E4535;--leaf3:#3E5A45;--bark:#2E261F}
}
:root[data-theme="dark"]{--bg:#000;--ink:#F5F5F7;--muted:#A1A1A6;--panel:#161617;--line:#424245;--link:#2997FF;;--sky1:#0D1418;--sky2:#1A1E22;--sun:#E9C77B;--far:#1E2327;--far2:#2A3035;--ink:#0A0A0B;--ochre:#6B5E48;--sage:#4F5B4E;--blush:#6A5A55;--terra:#6E3E2E;--terra2:#552F22;--ivory:#8E877A;--shut:#2E4034;--shut2:#24332A;--shadow:#141312;--wood:#4A3A2C;--lamp:#F0C06A;--stone:#4A463F;--stone2:#3A362F;--glass:#253033;--lawn:#2B3527;--water:#28413F;--water2:#1C302F;--leaf1:#223428;--leaf2:#2E4535;--leaf3:#3E5A45;--bark:#2E261F}
*,*::before,*::after{box-sizing:inherit;margin:0}
html{scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Helvetica Neue",Arial,sans-serif;
  font-size:17px;line-height:1.47;letter-spacing:-0.022em;-webkit-font-smoothing:antialiased}
.wrap{max-width:none;margin:0;padding:0 clamp(24px,5vw,96px)}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:2px solid var(--link);outline-offset:4px;border-radius:4px}

header.bar{height:52px;display:flex;align-items:center}
header.bar .wrap{width:100%;display:flex;justify-content:space-between;align-items:center;font-size:14px}
header.bar .name{font-weight:600;letter-spacing:-0.01em}

.hero{padding:clamp(72px,12vh,140px) 0 clamp(40px,6vh,72px)}
.hero h1{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Helvetica Neue",Arial,sans-serif;
  font-weight:600;font-size:clamp(44px,8vw,104px);line-height:1.02;letter-spacing:-0.045em;max-width:13ch}

.scene{width:100%}
.scene svg{display:block;width:100%;height:auto}

.statement{padding:clamp(88px,14vh,150px) 0 clamp(96px,16vh,170px)}
.statement p{font-size:clamp(22px,2.6vw,30px);line-height:1.3;letter-spacing:-0.025em;font-weight:500;max-width:36ch}

.practice{padding:clamp(56px,8vh,88px) 0 clamp(88px,14vh,140px)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;border-top:1px solid var(--line);padding-top:32px}
.grid h2{font-size:19px;font-weight:600;letter-spacing:-0.02em;margin-bottom:8px}
.grid p{color:var(--muted);max-width:30ch}

footer{background:var(--panel);padding:56px 0 40px;font-size:14px}
.dir{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.legal{line-height:1.6}
.dir h3{font-size:14px;font-weight:600;margin-bottom:6px;letter-spacing:-0.01em}
.dir p{color:var(--muted)}
.legal{margin-top:48px;font-size:12px;color:var(--muted)}

@media (max-width:760px){.grid,.dir{grid-template-columns:1fr;gap:32px}}

.lamp{animation:glow 10s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:.35}45%,70%{opacity:1}}
.sway{transform-origin:630px 330px;transform-box:view-box;animation:sway 12s ease-in-out infinite}
@keyframes sway{0%,100%{transform:rotate(0)}50%{transform:rotate(.35deg)}}
.shimmer{animation:shim 6s ease-in-out infinite}
@keyframes shim{0%,100%{transform:translateX(0);opacity:.9}50%{transform:translateX(14px);opacity:.4}}
@media (prefers-reduced-motion:reduce){.lamp,.sway,.shimmer{animation:none}}

.note-list{list-style:none;padding:0;border-top:1px solid var(--line)}
.note-list li{border-bottom:1px solid var(--line)}
.note-list a{display:flex;justify-content:space-between;gap:24px;padding:22px 0;color:var(--ink)}
.note-list a:hover{text-decoration:none;color:var(--link)}
.note-list time{color:var(--muted);white-space:nowrap;font-size:15px}
.page{padding:clamp(72px,12vh,140px) 0 clamp(88px,14vh,140px)}
.page h1{font-weight:600;font-size:clamp(40px,6vw,72px);line-height:1.04;letter-spacing:-0.04em;margin-bottom:48px}
article{max-width:none}
article .meta{color:var(--muted);font-size:15px;margin-bottom:40px}
article h2{font-size:24px;font-weight:600;letter-spacing:-0.02em;margin:48px 0 12px}
article p,article li{font-size:19px;line-height:1.6;margin-bottom:18px}
article ul,article ol{padding-left:22px;margin-bottom:18px}
.disclaimer{margin-top:56px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.next{margin-top:32px;font-size:19px}
header.bar a.home{color:var(--ink);font-weight:600}
.tbl{overflow-x:auto;margin:8px 0 24px}table{border-collapse:collapse;width:100%;font-size:17px}th,td{text-align:left;padding:12px 16px 12px 0;border-bottom:1px solid var(--line)}th{font-weight:600}
.related{margin-top:48px;font-size:17px}
.page .wrap{max-width:calc(760px + 2*clamp(24px,5vw,96px));margin:0 auto}
.page h1{font-size:clamp(34px,4.6vw,56px)}
