html{background:#050706;min-width:320px;min-height:100%}a{color:inherit}:root{--bg:#060807;--panel:#ffffff0b;--edge-line:#ffffff1f;--edge-soft:#ffffff12;--text:#eef1ef;--muted:#98a09b;--lime:#9ec96a;--teal:#6ec2b0;--violet:#a481ad;--danger:#d2745f;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:radial-gradient(110% 70% at 50% -8%, #9ec96a1a, transparent 62%), radial-gradient(90% 60% at 0% 100%, #6ec2b012, transparent 60%), var(--bg);min-height:100dvh;color:var(--text);word-break:keep-all;-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0;font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,sans-serif}.shell{flex-direction:column;gap:12px;width:100%;max-width:460px;margin:0 auto;padding:18px 16px 36px;display:flex}.top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.brand h1{letter-spacing:-.015em;margin:0;font-size:20px;font-weight:700}.brand p{color:var(--muted);font-variant-numeric:tabular-nums;margin:4px 0 0;font-size:13px}.top-actions{align-items:center;gap:8px;display:flex}.streak{color:var(--lime);border:1px solid color-mix(in srgb, var(--lime) 35%, transparent);background:color-mix(in srgb, var(--lime) 10%, transparent);white-space:nowrap;border-radius:999px;padding:4px 9px;font-size:12px}.icon-button{border:1px solid var(--edge-line);background:var(--panel);width:36px;height:36px;color:var(--text);cursor:pointer;border-radius:8px;place-items:center;transition:transform .12s,border-color .12s;display:grid}.icon-button:hover{border-color:color-mix(in srgb, var(--lime) 45%, var(--edge-line))}.icon-button:active{transform:scale(.95)}.stages{align-items:center;gap:6px;display:flex}.pip{background:#ffffff1a;border-radius:999px;flex:1;height:3px;transition:background .26s,box-shadow .26s}.pip.active{background:#ffffff47}.pip.done.clean{background:var(--lime);box-shadow:0 0 8px color-mix(in srgb, var(--lime) 60%, transparent)}.pip.done.undo{background:var(--teal)}.pip.done.hint{background:var(--violet)}.stage-label{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:4px;font-size:12px}.board{border:1px solid var(--edge-soft);background:radial-gradient(80% 60% at 50% 0,#ffffff0d,#0000 70%),#ffffff06;border-radius:14px;padding:6px;transition:border-color .3s,box-shadow .3s;position:relative}.board.cleared{border-color:color-mix(in srgb, var(--lime) 55%, transparent);box-shadow:0 0 26px color-mix(in srgb, var(--lime) 22%, transparent)}.board svg{aspect-ratio:100/124;touch-action:none;width:100%;display:block;overflow:visible}.edge{stroke:#ffffff29;stroke-width:1.1px;stroke-linecap:round;transition:stroke .22s,stroke-width .22s}.edge.done{stroke:url(#traceGradient);stroke-width:2.4px}.edge.hint{stroke:var(--violet);stroke-width:2px;stroke-dasharray:3 3;animation:.9s linear infinite dash}.node-ring{fill:none;stroke:#ffffff29;stroke-width:.7px;transition:stroke .22s}.node-core{fill:#ffffff6b;transition:fill .22s,r .22s}.node.startable .node-ring{stroke:color-mix(in srgb, var(--lime) 65%, transparent);animation:2.4s ease-in-out infinite breathe}.node.startable .node-core{fill:var(--lime)}.node.current .node-ring{stroke:var(--lime);stroke-width:1.1px}.node.current .node-core{fill:#f2f7ea;r:3.2}.progress{background:#ffffff14;border-radius:999px;height:2px;position:absolute;bottom:8px;left:12px;right:12px;overflow:hidden}.progress i{background:linear-gradient(90deg, var(--lime), var(--teal));transform-origin:0;border-radius:999px;height:100%;transition:transform .2s;display:block}.controls{gap:8px;display:flex}button.ghost,button.primary{cursor:pointer;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:6px;min-height:46px;font-family:inherit;font-size:14px;font-weight:700;transition:transform .11s,opacity .14s,border-color .14s;display:inline-flex}button.ghost{border:1px solid var(--edge-line);background:var(--panel);color:var(--text)}button.primary{border:1px solid color-mix(in srgb, var(--lime) 55%, transparent);color:#f2f7ea;background:linear-gradient(#9ec96a4d,#9ec96a24)}button.primary.wide{width:100%}button.ghost:active,button.primary:active{transform:scale(.97)}button:disabled{opacity:.32;cursor:not-allowed}.lede{color:var(--muted);text-align:center;margin:0;font-size:13px;line-height:1.6}.result{border:1px solid var(--edge-line);background:var(--panel);border-radius:12px;flex-direction:column;gap:12px;padding:18px 16px;animation:.3s rise;display:flex}.result h2{letter-spacing:-.01em;margin:0;font-size:18px}.share-grid{letter-spacing:3px;font-size:22px;line-height:1.1}.result-line{color:var(--muted);font-variant-numeric:tabular-nums;margin:0;font-size:13px}.stats{text-align:center;grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.stats div{background:#ffffff0a;border-radius:8px;flex-direction:column;gap:2px;padding:8px 2px;display:flex}.stats strong{font-variant-numeric:tabular-nums;font-size:15px}.stats span{color:var(--muted);font-size:11px}.tomorrow{color:var(--muted);text-align:center;margin:0;font-size:12px}.portal{gap:8px;margin-top:4px;display:flex}.portal a{text-align:center;border:1px solid var(--edge-soft);color:var(--muted);background:#ffffff08;border-radius:10px;flex:1;padding:11px 8px;font-size:13px;font-weight:600;text-decoration:none}.portal a:hover{color:var(--text);border-color:var(--edge-line)}.toast{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--edge-line);text-align:center;background:#0a0c0beb;border-radius:999px;max-width:calc(100vw - 32px);padding:10px 16px;font-size:13px;font-weight:600;animation:.2s rise-center;position:fixed;bottom:26px;left:50%;transform:translate(-50%)}.toast.success{border-color:color-mix(in srgb, var(--lime) 55%, transparent)}.toast.danger{border-color:color-mix(in srgb, var(--danger) 55%, transparent)}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20;background:#040505b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--edge-line);background:#0e1110;border-radius:12px;width:100%;max-width:380px;max-height:80vh;padding:20px 18px;position:relative;overflow-y:auto}.modal h2{margin:0 0 12px;font-size:17px}.modal ul{color:#eef1efd9;flex-direction:column;gap:8px;margin:0;padding-left:18px;font-size:13px;line-height:1.6;display:flex}.modal .close{position:absolute;top:12px;right:12px}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes rise-center{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}@keyframes breathe{0%,to{opacity:.5}50%{opacity:1}}@keyframes dash{to{stroke-dashoffset:-12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (min-width:768px){.shell{justify-content:center;min-height:100dvh;padding-top:28px;padding-bottom:28px}}