:root{--bg: #0b1d2d;--fg: #e9f4f1;--muted: #b9c7c4;--accent: #00a884;--card: #11283c;--line: #17344f}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--fg)}.mobile-shell{max-width:420px;margin:0 auto;height:100vh;display:flex;flex-direction:column;overflow:hidden;position:relative}.header{padding:16px 16px 8px;font-weight:700;letter-spacing:.2px;background-color:var(--bg);position:sticky;top:0;z-index:2}.content{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 16px;margin-bottom:64px}.scrollable-content{overflow-y:scroll!important;scrollbar-width:auto!important;scrollbar-color:var(--accent) transparent!important}.scrollable-content::-webkit-scrollbar{width:16px!important;background-color:transparent!important}.scrollable-content::-webkit-scrollbar-thumb{background-color:var(--accent)!important;border-radius:8px!important;border:4px solid transparent!important;background-clip:content-box!important}.scrollable-content::-webkit-scrollbar-track{background-color:transparent!important}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.tile{background:#17344f;color:#e3f6f1;border:1px solid #24516f;border-radius:25%;display:flex;align-items:center;justify-content:center;min-height:96px;font-size:18px;font-weight:600}.create-tile{background:#17344f;color:#e3f6f1;border:4px solid #24516f;border-radius:5%;justify-content:center;vertical-align:center;padding-top:4%;padding-bottom:4%;font-size:18px;font-weight:600}.list-entry-tile{background:#17344f;color:#e3f6f1;border:1px solid #24516f;border-radius:5%;justify-content:center;vertical-align:center;font-size:18px;font-weight:600}.danger-tile{background:#17344f;color:var(--accent);border:4px solid;border-color:var(--bg);border-radius:50%;justify-content:center;min-height:60px;min-width:60px;font-style:normal;font-size:xx-large}.button{background:var(--accent);color:#03261d;border:none;border-radius:10px;padding:12px 16px;font-weight:700}.add-button{background:var(--accent);color:#03261d;border:none;border-radius:10px;padding:12px 30px;font-weight:700}.input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:#0f2336;color:var(--fg)}.item-input{width:77%;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:#0f2336;color:var(--fg)}.list{list-style:none;margin:8px 0 72px;padding:0}.list li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);touch-action:pan-y;position:relative}.list li{will-change:transform}.dragging-floating{display:flex;align-items:center;gap:10px;padding:10px 0;box-shadow:0 12px 32px #00000073;transform-origin:center top;border-radius:8px;background:var(--card);opacity:.98}.badge{margin-left:auto;color:var(--muted)}.drag-handle{display:grid;grid-template:repeat(4,auto) / repeat(2,auto);place-items:center;gap:4px;padding:10px 16px;border:1px solid #24516f;border-radius:25%;background:#17344f;color:#e3f6f1;cursor:grab;touch-action:none}.drag-handle:before{content:"";grid-area:2/3/1/1;background:var(--line);border-radius:4px;z-index:1}.drag-handle i{width:1px;height:1px;background:var(--fg);z-index:1}.dragging{opacity:.5;flex:0 0 auto;width:auto}.list li.drag-target{border-top:2px solid var(--accent)}.footer{position:fixed;left:0;right:0;bottom:0;padding:8px 16px 16px;background:var(--bg);border-top:1px solid var(--line);z-index:10}.footer-bar{max-width:420px;margin:0 auto;display:flex;justify-content:center}.version-text{font-size:.88rem;color:var(--muted)}.copyright-text{font-size:.78rem;color:var(--muted)}.interactive-btn{background:#17344f;color:#e3f6f1;border:1px solid #24516f;border-radius:25%;padding:10px 16px;font-weight:600;text-decoration:none;font-size:80%}.adjustment-btn{background:#17344f;color:#e3f6f1;border:1px solid #24516f;border-radius:25%;padding:8px;font-weight:400;text-decoration:none}.interactive-btn:active{transform:translateY(1px)}.checkbox{accent-color:var(--accent)}.shimmer{position:relative;overflow:hidden}.shimmer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);animation:shimmer 1.2s infinite}@keyframes shimmer{to{transform:translate(100%)}}.skel-line{height:16px;background:#0f2336;border-radius:8px}.skel-input{height:44px;background:#0f2336;border-radius:10px;flex:1}.skel-chip{width:72px;height:36px;background:#0f2336;border-radius:10px}.toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%);background:#0f2336;border:1px solid var(--line);color:var(--fg);padding:10px 14px;border-radius:10px;box-shadow:0 6px 20px #00000059;z-index:60;animation:toast-in .2s ease-out}.share-btn{position:fixed;right:24px;top:16px;background:var(--card);color:var(--fg);border:none;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #00000059;cursor:pointer;z-index:70}.share-btn:active{transform:translateY(1px)}.share-btn svg{display:block}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}