.fn a{color:#0f7355}.fn a:hover{color:#0a5a42}.fn{--ground:#f1f0ea;--card:#fbfaf6;--ink:#17201c;--soft:#4b5550;--green:#0f7355;--mint:#d6ebe1;--danger:#c4472f;--blush:#f6ddd5;font-family:var(--font-space-grotesk),system-ui,sans-serif;color:var(--ink);background:var(--ground);position:relative;overflow-x:clip}.fn *{box-sizing:border-box}.fn .serif{font-family:var(--font-fraunces),Georgia,serif;font-variation-settings:"opsz" 120}.fn .mono{font-family:var(--font-jetbrains-mono),monospace}.fn .wrap{max-width:1320px;margin:0 auto;padding:0 32px}.fn .btn{white-space:nowrap;border-radius:12px;align-items:center;height:52px;padding:0 24px;font-size:16px;font-weight:600;text-decoration:none;transition:transform .35s cubic-bezier(.16,1,.3,1),background .3s;display:inline-flex}.fn .btn-p{background:var(--green);color:#fff}.fn .btn-p:hover{color:#fff;background:#0a5a42;transform:translateY(-2px)}.fn .btn-g{color:var(--ink);box-shadow:inset 0 0 0 1.5px #17201c40}.fn .btn-g:hover{color:var(--ink);background:#17201c0a}.fn .grid-paper{pointer-events:none;background-image:linear-gradient(#0f735512 1px,#0000 1px),linear-gradient(90deg,#0f735512 1px,#0000 1px);background-size:32px 32px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 40%,#0000);mask-image:linear-gradient(#000 40%,#0000)}.fn .chip{background:var(--card);white-space:nowrap;border-radius:14px;align-items:center;gap:10px;padding:12px 16px;font-size:15px;font-weight:500;display:flex;position:absolute;box-shadow:0 18px 40px -20px #17201c59,inset 0 0 0 1px #17201c0f}.fn .chip i{border-radius:50%;flex:none;width:10px;height:10px}.fn .johari{height:720px;position:relative}.fn .quad{border-radius:24px;padding:22px 24px;font-size:15px;line-height:1.45;position:absolute}.fn .quad b{font-family:var(--font-fraunces),serif;margin-bottom:4px;font-size:22px;font-weight:600;display:block}.fn .topic{background:var(--card);width:200px;transform:translate(var(--x1),var(--y1));border-radius:12px;padding:12px 14px;font-size:14px;font-weight:600;position:absolute;top:0;left:0;box-shadow:0 14px 30px -18px #17201c73,inset 0 0 0 1px #17201c14}.fn .topic small{font-family:var(--font-jetbrains-mono),monospace;color:var(--soft);margin-top:4px;font-size:11px;font-weight:400;display:block}.fn .rung{grid-template-columns:240px minmax(0,1fr) 90px;align-items:center;gap:20px;padding:16px 0;display:grid;box-shadow:inset 0 -1px #17201c14}.fn .rung .bar{background:var(--mint);border-radius:7px;height:14px;overflow:hidden}.fn .rung .bar i{background:var(--green);height:100%;width:var(--w);border-radius:7px;display:block}.fn .day{background:var(--green);border-radius:10px 10px 4px 4px;width:36px;position:absolute;bottom:0}.fn .ward{background:var(--card);border-radius:22px;padding:22px;position:relative;box-shadow:inset 0 0 0 1px #17201c14}.fn .pin{background:var(--mint);color:#0a4a37;border-radius:999px;align-items:center;gap:6px;margin:4px 6px 0 0;padding:6px 10px;font-size:13px;font-weight:500;display:inline-flex}@media (prefers-reduced-motion:no-preference){.fn .float1{animation:9s ease-in-out infinite float}.fn .float2{animation:11s ease-in-out infinite reverse float}.fn .float3{animation:13s ease-in-out infinite float}.fn .danger{animation:2.6s ease-in-out infinite pulse}.fn .rise{animation:1s cubic-bezier(.16,1,.3,1) both enter}@supports (animation-timeline:view()){.fn .reveal{animation:linear both enter;animation-timeline:view();animation-range:entry entry 55%}.fn .topic{animation:linear both sort;animation-timeline:view();animation-range:entry 30% contain 60%}.fn .rung .bar i{animation:linear both grow;animation-timeline:view();animation-range:entry 20% contain 40%}.fn .day{animation:linear both sprout;animation-timeline:view();animation-range:entry 10% contain 50%}}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes pulse{0%,to{box-shadow:0 0 #c4472f00,inset 0 0 0 2px #c4472f80}50%{box-shadow:0 0 0 10px #c4472f1f,inset 0 0 0 2px #c4472fe6}}@keyframes enter{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}@keyframes sort{0%{transform:translate(var(--x0),var(--y0))rotate(-2deg)}to{transform:translate(var(--x1),var(--y1))}}@keyframes grow{0%{width:0}to{width:var(--w)}}@keyframes sprout{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@media (max-width:900px){.fn .split{grid-template-columns:1fr!important}.fn .rung{grid-template-columns:1fr}.fn .johari{transform-origin:0 0;height:440px;transform:scale(.6)}}@media (max-width:640px){.fn .hero-art{margin-top:8px;height:340px!important}.fn .hero-art img{width:560px!important;top:0!important;right:-260px!important}.fn .hero-art .chip{gap:6px;padding:8px 12px;font-size:13px}.fn .hero-art .chip .mono{font-size:11px!important}.fn .hero-art .float1{top:30px!important;left:0!important}.fn .hero-art .float2{top:150px!important;left:0!important}.fn .hero-art .float3{bottom:40px!important;left:24px!important;right:auto!important}}
