/* To Do — the looks. Each theme sets fonts, chrome, edges and patterns; the paper colour sets --surface (board, bottom bar, rows). */

/* ===== paper colours (pastel · vibrant · metallic) ===== */
body[data-paper="blush"]    { --surface: #fdf3f5; --bg: #f9e1e8; --row: rgba(255,255,255,.6); }
body[data-paper="sky"]      { --surface: #f2f7fd; --bg: #dbe8f8; --row: rgba(255,255,255,.6); }
body[data-paper="matcha"]   { --surface: #f4f9f1; --bg: #e2eedc; --row: rgba(255,255,255,.6); }
body[data-paper="butter"]   { --surface: #fdf8e9; --bg: #f8ecc7; --row: rgba(255,255,255,.6); }
body[data-paper="lavender"] { --surface: #f7f3fd; --bg: #e8e0f6; --row: rgba(255,255,255,.6); }
body[data-paper="peach"]    { --surface: #fdf3ec; --bg: #fbe4d8; --row: rgba(255,255,255,.6); }
body[data-paper="cream"]    { --surface: #fdf9f2; --bg: #f3ece0; --row: rgba(255,255,255,.55); }
body[data-paper="hotpink"]  { --surface: #ffd3e4; --bg: #ff79b0; --row: rgba(255,255,255,.55); --accent: #e0266f; --accent-ink: #a8124c; --accent-soft: #ffe6f0; --accent-soft-2: #ffb3d1; }
body[data-paper="electric"] { --surface: #d9e7ff; --bg: #4d8cff; --row: rgba(255,255,255,.55); --accent: #2f6fe4; --accent-ink: #1d4db0; --accent-soft: #e6efff; --accent-soft-2: #b9d0ff; }
body[data-paper="lime"]     { --surface: #e9f9d2; --bg: #a6e24a; --row: rgba(255,255,255,.55); --accent: #5fa31c; --accent-ink: #3e7210; --accent-soft: #f0fbdd; --accent-soft-2: #cdf09a; }
body[data-paper="sunflower"]{ --surface: #fff3c4; --bg: #ffc83d; --row: rgba(255,255,255,.55); --accent: #e39a00; --accent-ink: #a86f00; --accent-soft: #fff7da; --accent-soft-2: #ffe08a; }
body[data-paper="violet"]   { --surface: #ecd9ff; --bg: #9b5cff; --row: rgba(255,255,255,.55); --accent: #7a3ce6; --accent-ink: #5522b3; --accent-soft: #f3e9ff; --accent-soft-2: #d6bbff; }
body[data-paper="coral"]    { --surface: #ffe0d6; --bg: #ff7a59; --row: rgba(255,255,255,.55); --accent: #ef5a36; --accent-ink: #b53a1c; --accent-soft: #fff0ea; --accent-soft-2: #ffc2b0; }
body[data-paper="rosegold"] { --surface: #f6e0da; --bg: linear-gradient(135deg, #e8b4a6, #f7d9d0 40%, #d99a88 70%, #f3cfc5); --row: rgba(255,255,255,.5); --accent: #c4766a; --accent-ink: #8f4b40; --accent-soft: #fbeae6; --accent-soft-2: #efc5bb; }
body[data-paper="silver"]   { --surface: #f0f2f5; --bg: linear-gradient(135deg, #c9ced6, #f4f6f8 40%, #aeb5c0 70%, #e9ecf0); --row: rgba(255,255,255,.5); --accent: #6f7b8c; --accent-ink: #46505e; --accent-soft: #eef1f5; --accent-soft-2: #cfd6df; }
body[data-paper="gold"]     { --surface: #fbf1d6; --bg: linear-gradient(135deg, #d9b45a, #f6e4a6 40%, #c89b2c 70%, #f1dc9a); --row: rgba(255,255,255,.5); --accent: #b8902a; --accent-ink: #80611a; --accent-soft: #fdf6e3; --accent-soft-2: #efdc9d; }
body[data-paper="holo"]     { --surface: #f4f1fb; --bg: linear-gradient(120deg, #ffd1e8, #d1e4ff 25%, #d4ffe9 50%, #fff3c4 75%, #ead1ff); --row: rgba(255,255,255,.5); --accent: #9a7fd6; --accent-ink: #6a51a8; --accent-soft: #f1ebfb; --accent-soft-2: #dccffa; }
body[data-paper="rosegold"] .nav, body[data-paper="silver"] .nav, body[data-paper="gold"] .nav, body[data-paper="holo"] .nav, body[data-paper="rosegold"] .widget, body[data-paper="silver"] .widget, body[data-paper="gold"] .widget, body[data-paper="holo"] .widget { background-image: linear-gradient(135deg, rgba(255,255,255,.65), rgba(255,255,255,0) 45%, rgba(255,255,255,.35)); }
body[data-paper="custom"] { --surface: var(--custom, #fdf3f5); --bg: color-mix(in srgb, var(--custom, #fdf3f5) 70%, #000 0%); --row: rgba(255,255,255,.45); }
body[data-paper="custom"] { --bg: color-mix(in srgb, var(--custom, #fdf3f5) 78%, #7a5560 22%); }
body.has-photo { --bg-pattern: none !important; }

/* ===== 1. Cute Paper (the first look: strawberry pad) ===== */
body[data-theme="paper"][data-paper="blush"] { --surface: #fdf9f2; --row: transparent; }
body[data-theme="paper"] .row { background: transparent; border-radius: 0; margin-bottom: 0; padding: 9px 2px; }
body[data-theme="paper"] .nav { background: rgba(253, 249, 242, .94); }
body[data-theme="paper"] { --bg-pattern: repeating-linear-gradient(0deg, rgba(255,255,255,.55) 0 22px, transparent 22px 44px), repeating-linear-gradient(90deg, rgba(255,255,255,.55) 0 22px, transparent 22px 44px); --border: 2px dashed var(--accent-soft-2); }
body[data-theme="paper"] .widget::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; background: linear-gradient(180deg, rgba(46,58,89,.10), rgba(46,58,89,.02)); }
body[data-theme="paper"] .widget { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ===== 2. Kawaii Digital (purple-pink gingham, clouds, bubbly type) ===== */
body[data-theme="kawaii"] { --font-display: "Mochiy Pop One", "Fredoka", sans-serif; --font-hand: "Fredoka", sans-serif; --accent: #9b7be0; --accent-ink: #6a4bc0; --accent-soft: #ece4ff; --accent-soft-2: #d9ccff; --ink: #4a3d6b; --ink-2: #6f6391; --ink-3: #9a8fbb; --r: 26px; --border: none; --bg-pattern: repeating-linear-gradient(0deg, rgba(255,255,255,.5) 0 26px, transparent 26px 52px), repeating-linear-gradient(90deg, rgba(255,255,255,.5) 0 26px, transparent 26px 52px); --shadow: 0 10px 28px rgba(120, 90, 200, .18); }
body[data-theme="kawaii"][data-paper="blush"] { --bg: #f5c9e2; --surface: #c9b3f5; --row: rgba(255,255,255,.75); }
body[data-theme="kawaii"][data-paper="lavender"] { --bg: #e4d4ff; --surface: #c4aef3; --row: rgba(255,255,255,.75); }
body[data-theme="kawaii"][data-paper="sky"] { --bg: #d8e8ff; --surface: #a9d2f5; --row: rgba(255,255,255,.8); }
body[data-theme="kawaii"] .widget { border: 3px solid #fff; }
body[data-theme="kawaii"] .widget::after { display: none; }
body[data-theme="kawaii"] .w-head h3, body[data-theme="kawaii"] .badge-title, body[data-theme="kawaii"] .zone-h h3 { background: #fff; color: var(--accent-ink); text-shadow: 0 2px 0 #e7deff; }
body[data-theme="kawaii"] .badge-title::before, body[data-theme="kawaii"] .badge-title::after { display: none; }
body[data-theme="kawaii"] .sheet-head { position: relative; }
body[data-theme="kawaii"] .cloud { position: absolute; top: 4px; width: 64px; height: 40px; pointer-events: none; }
body[data-theme="kawaii"] .cloud.l { left: 0; } body[data-theme="kawaii"] .cloud.r { right: 0; transform: scaleX(-1); }
body[data-theme="kawaii"] .badge-title { font-size: 30px; letter-spacing: 1px; }
body[data-theme="kawaii"] .row { background: #fff; border-radius: 999px; border-bottom: 0; padding: 8px 12px; }
body[data-theme="kawaii"] .check { border-radius: 50%; border-color: #f5a3c7; }
body[data-theme="kawaii"] .check.on { background: #f5a3c7; border-color: #f5a3c7; }
body[data-theme="kawaii"] .check::after { content: "♥"; position: absolute; color: #f5a3c7; font-size: 16px; } body[data-theme="kawaii"] .check.on::after { color: #fff; } body[data-theme="kawaii"] .check svg { display: none; }
body[data-theme="kawaii"] .nav { border-radius: 26px 26px 0 0; border: 3px solid #fff; border-bottom: 0; }
@media (min-width: 900px) { body[data-theme="kawaii"] .nav { border-radius: 999px; border-bottom: 3px solid #fff; } }
body[data-theme="kawaii"] .btn { border: 3px solid #fff; box-shadow: 0 6px 14px rgba(120,90,200,.25); }
body[data-theme="kawaii"] .w-goals, body[data-theme="kawaii"] .w-rem { --surface: #b5d8f7; } body[data-theme="kawaii"] .w-rem { --surface: #f5b3cf; } body[data-theme="kawaii"] .w-notes { --surface: #b8a4e8; }
body[data-theme="kawaii"] .widget.w-goals, body[data-theme="kawaii"] .widget.w-rem, body[data-theme="kawaii"] .widget.w-notes { background: var(--surface); }
body[data-theme="kawaii"] .sparkle::before { content: "✦"; position: absolute; left: 14px; top: 10px; color: #fff; font-size: 20px; z-index: 0; }

/* ===== 3. Scrapbook / junk journal ===== */
body[data-theme="scrapbook"] { --font-display: "Special Elite", "Courier New", monospace; --font-hand: "Homemade Apple", "Caveat", cursive; --font-body: "Nunito", sans-serif; --accent: #b07a85; --accent-ink: #70543e; --accent-soft: #eddcdb; --accent-soft-2: #d9bfb8; --ink: #4a3b32; --ink-2: #70543e; --ink-3: #9a8477; --line: rgba(74,59,50,.16); --line-2: rgba(74,59,50,.3); --r: 6px; --border: none; --shadow: 0 8px 22px rgba(60,40,20,.18), 0 1px 2px rgba(60,40,20,.2); --tilt: -0.6deg; }
body[data-theme="scrapbook"][data-paper="blush"] { --surface: #f3e9dc; --bg: #c9a77f; }
body[data-theme="scrapbook"][data-paper="cream"] { --surface: #efe4d0; --bg: #b8905f; }
body[data-theme="scrapbook"][data-paper="sky"] { --surface: #eaf0ee; --bg: #8fa3a1; }
body[data-theme="scrapbook"][data-paper="matcha"] { --surface: #eae3cc; --bg: #97a176; }
body[data-theme="scrapbook"] { --bg-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .15 0 0 0 .18 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E"); }
body[data-theme="scrapbook"] .widget { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"); clip-path: polygon(0 1.5%, 2% 0, 6% 1%, 10% 0, 14% 1.2%, 20% 0, 26% .8%, 33% 0, 40% 1%, 47% 0, 55% 1.2%, 62% 0, 70% .9%, 78% 0, 85% 1.1%, 92% 0, 97% 1%, 100% 0, 100% 98.5%, 98% 100%, 93% 99%, 87% 100%, 80% 98.8%, 72% 100%, 65% 99.2%, 58% 100%, 50% 99%, 42% 100%, 35% 99%, 27% 100%, 20% 98.9%, 13% 100%, 7% 99%, 2% 100%, 0 99%); }
body[data-theme="scrapbook"] .widget::after { display: none; }
body[data-theme="scrapbook"] .widget::before { content: ""; position: absolute; top: -8px; left: 50%; width: 110px; height: 26px; transform: translateX(-50%) rotate(-3deg); background: repeating-linear-gradient(135deg, rgba(176,122,133,.75) 0 8px, rgba(237,220,219,.75) 8px 16px); opacity: .9; z-index: 2; box-shadow: 0 1px 2px rgba(0,0,0,.15); }
body[data-theme="scrapbook"] .widget:nth-child(even) { --tilt: .7deg; } body[data-theme="scrapbook"] .widget:nth-child(even)::before { transform: translateX(-50%) rotate(4deg); background: repeating-linear-gradient(135deg, rgba(151,161,118,.75) 0 8px, rgba(234,227,204,.75) 8px 16px); }
body[data-theme="scrapbook"] .w-head h3, body[data-theme="scrapbook"] .badge-title, body[data-theme="scrapbook"] .zone-h h3 { background: transparent; color: var(--accent-ink); border: 2px solid var(--accent-ink); border-radius: 4px; padding: 2px 10px; letter-spacing: 1px; text-transform: uppercase; font-size: 15px; transform: rotate(-1deg); }
body[data-theme="scrapbook"] .badge-title { font-size: 24px; }
body[data-theme="scrapbook"] .badge-title::before, body[data-theme="scrapbook"] .badge-title::after { display: none; }
body[data-theme="scrapbook"] .row { background: transparent; border-radius: 0; border-bottom: 1.5px solid var(--line-2); }
body[data-theme="scrapbook"] .check { border-radius: 3px; border-color: var(--accent-ink); background: var(--surface); } body[data-theme="scrapbook"] .check.on { background: var(--accent-ink); border-color: var(--accent-ink); }
body[data-theme="scrapbook"] .thumb { border-radius: 2px; border: 6px solid #fff; border-bottom-width: 14px; box-shadow: 0 3px 6px rgba(0,0,0,.25); }
body[data-theme="scrapbook"] .nav { border-top: 3px dashed var(--accent-soft-2); }
body[data-theme="scrapbook"] .btn { border-radius: 4px; }
body[data-theme="scrapbook"] .chip { border-radius: 3px; }
body[data-theme="scrapbook"] .slogan { font-size: 17px; }

/* ===== 4. Professional (calm, editorial) ===== */
body[data-theme="professional"] { --font-display: "Fraunces", Georgia, serif; --font-body: "Inter", system-ui, sans-serif; --font-hand: "Fraunces", Georgia, serif; --accent: #2e3a59; --accent-ink: #1f2740; --accent-soft: #eef0f5; --accent-soft-2: #d9dde8; --ink: #1f2740; --ink-2: #4a5470; --ink-3: #7d869e; --line: rgba(31,39,64,.12); --line-2: rgba(31,39,64,.22); --r: 14px; --border: none; --shadow: 0 1px 2px rgba(31,39,64,.06), 0 8px 24px rgba(31,39,64,.06); --bg-pattern: none; --tilt: 0deg; }
body[data-theme="professional"][data-paper="blush"] { --surface: #ffffff; --bg: #f4f1ee; --row: transparent; }
body[data-theme="professional"][data-paper="cream"] { --surface: #fffdf8; --bg: #efeae1; --row: transparent; }
body[data-theme="professional"][data-paper="sky"] { --surface: #ffffff; --bg: #eef2f7; --row: transparent; }
body[data-theme="professional"] .widget { border: 1px solid var(--line); }
body[data-theme="professional"] .widget::after { display: none; }
body[data-theme="professional"] .w-head h3, body[data-theme="professional"] .badge-title, body[data-theme="professional"] .zone-h h3 { background: transparent; padding: 0; border-radius: 0; font-weight: 600; letter-spacing: -.2px; }
body[data-theme="professional"] .badge-title { font-size: 30px; font-style: italic; font-weight: 400; } body[data-theme="professional"] .badge-title::before, body[data-theme="professional"] .badge-title::after { display: none; }
body[data-theme="professional"] .slogan { font-style: italic; font-size: 16px; }
body[data-theme="professional"] .row { background: transparent; border-radius: 0; border-bottom: 1px solid var(--line); margin: 0; padding: 10px 2px; }
body[data-theme="professional"] .check { border-radius: 50%; border-width: 1.5px; }
body[data-theme="professional"] .thumb { transform: none; border-radius: 8px; border: 0; box-shadow: none; }
body[data-theme="professional"] .row:nth-child(even) .thumb { transform: none; }
body[data-theme="professional"] .btn { border-radius: 10px; box-shadow: none; }
body[data-theme="professional"] .chip { border-radius: 6px; }
body[data-theme="professional"] .nav { background: var(--surface); }
body[data-theme="professional"] .dateline .date { font-size: 17px; font-weight: 600; }
body[data-theme="professional"] .motif { display: none; }
body[data-theme="professional"] .dump { border-color: var(--line); }

/* ===== 5. Rainbow (pastel stripes, marker type) ===== */
body[data-theme="rainbow"] { --font-display: "Baloo 2", "Fredoka", sans-serif; --font-hand: "Caveat", cursive; --accent: #f0719a; --accent-ink: #c43f6c; --accent-soft: #fff0f5; --accent-soft-2: #ffd1e1; --ink: #3a3550; --ink-2: #605a78; --ink-3: #8f89a6; --r: 20px; --border: 2.5px solid #3a3550; --bg-pattern: none; }
body[data-theme="rainbow"][data-paper="blush"] { --surface: #ffffff; --bg: linear-gradient(180deg, #ffd1dc, #ffe4c4 20%, #fff5b8 40%, #d7f5d0 60%, #cfe6ff 80%, #e6d7ff); --row: transparent; }
body[data-theme="rainbow"][data-paper="cream"] { --surface: #fffdf6; --bg: #f7f1e6; --row: transparent; }
body[data-theme="rainbow"] .widget { border: 2.5px solid #3a3550; box-shadow: 6px 6px 0 #3a3550; }
body[data-theme="rainbow"] .widget::after { display: none; }
body[data-theme="rainbow"] .w-head h3, body[data-theme="rainbow"] .badge-title, body[data-theme="rainbow"] .zone-h h3 { background: #fff; border: 2.5px solid #3a3550; color: #3a3550; box-shadow: 3px 3px 0 #3a3550; border-radius: 12px; }
body[data-theme="rainbow"] .badge-title::before, body[data-theme="rainbow"] .badge-title::after { display: none; }
body[data-theme="rainbow"] .rows .row { border-bottom: 0; border-radius: 10px; margin-bottom: 6px; padding: 8px 10px; }
body[data-theme="rainbow"] .rows .row:nth-child(6n+1) { background: #ffd1dc; } body[data-theme="rainbow"] .rows .row:nth-child(6n+2) { background: #ffe4c4; } body[data-theme="rainbow"] .rows .row:nth-child(6n+3) { background: #fff5b8; } body[data-theme="rainbow"] .rows .row:nth-child(6n+4) { background: #d7f5d0; } body[data-theme="rainbow"] .rows .row:nth-child(6n+5) { background: #cfe6ff; } body[data-theme="rainbow"] .rows .row:nth-child(6n+6) { background: #e6d7ff; }
body[data-theme="rainbow"] .check { border-radius: 50%; border-color: #3a3550; } body[data-theme="rainbow"] .check.on { background: #3a3550; border-color: #3a3550; }
body[data-theme="rainbow"] .check::after { content: "♥"; position: absolute; color: #3a3550; font-size: 15px; } body[data-theme="rainbow"] .check.on::after { color: #fff; } body[data-theme="rainbow"] .check svg { display: none; }
body[data-theme="rainbow"] .btn { border: 2.5px solid #3a3550; box-shadow: 3px 3px 0 #3a3550; color: #3a3550; background: #fff5b8; }
body[data-theme="rainbow"] .nav { border-top: 2.5px solid #3a3550; }
body[data-theme="rainbow"] .chip { border: 1.5px solid #3a3550; }
body[data-theme="rainbow"] .thumb { border-color: #3a3550; border-width: 2px; }
body[data-theme="rainbow"] .progress { border: 2px solid #3a3550; } body[data-theme="rainbow"] .progress i { background: linear-gradient(90deg, #ffd1dc, #fff5b8, #d7f5d0, #cfe6ff, #e6d7ff); }

/* ===== pearl: mother-of-pearl iridescent shimmer ===== */
body[data-paper="pearl"] { --surface: #f7f3f6; --bg: linear-gradient(120deg, #f6e6ef, #e6eefb 30%, #e7f6ee 50%, #fdf3e2 70%, #efe6fb); --row: rgba(255,255,255,.55); --accent: #b07aa8; --accent-ink: #7c4f78; --accent-soft: #f6ecf4; --accent-soft-2: #e8d2e4; }
body[data-paper="pearl"] .widget, body[data-paper="pearl"] .nav, body[data-paper="pearl"] .card, body[data-paper="pearl"] .modal, body[data-paper="pearl"] .entry .sheet { position: relative; background-image: linear-gradient(115deg, rgba(255,255,255,.75), rgba(255,255,255,0) 35%, rgba(255,255,255,.35) 60%, rgba(255,255,255,0) 80%), linear-gradient(120deg, rgba(246,214,232,.55), rgba(214,228,250,.55) 30%, rgba(214,246,232,.55) 50%, rgba(253,243,226,.55) 70%, rgba(236,224,250,.55)); }
body[data-paper="pearl"] .widget::before, body[data-paper="pearl"] .nav::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.65) 48%, rgba(255,210,235,.35) 52%, rgba(200,230,255,.35) 56%, transparent 70%); background-size: 260% 100%; animation: pearl 9s ease-in-out infinite; mix-blend-mode: screen; z-index: 0; }
@keyframes pearl { 0% { background-position: 120% 0; } 100% { background-position: -140% 0; } }
@media (prefers-reduced-motion: reduce) { body[data-paper="pearl"] .widget::before, body[data-paper="pearl"] .nav::before { animation: none; } }

/* ===== 6. Glass (frosted, translucent, soft light edge) ===== */
body[data-theme="glass"] { --font-display: "Fredoka", sans-serif; --accent: #8b6ee8; --accent-ink: #5a44b8; --accent-soft: rgba(255,255,255,.55); --accent-soft-2: rgba(255,255,255,.75); --ink: #2b2744; --ink-2: #4e4870; --ink-3: #7b7599; --line: rgba(43,39,68,.14); --line-2: rgba(43,39,68,.24); --r: 26px; --border: none; --shadow: 0 10px 40px rgba(60, 40, 120, .14), inset 0 1px 0 rgba(255,255,255,.8); --bg-pattern: none; --row: rgba(255,255,255,.42); }
body[data-theme="glass"][data-paper="blush"] { --surface: rgba(255,255,255,.42); --bg: linear-gradient(135deg, #ffd6e7, #d9e4ff 45%, #d8f3ea 75%, #fff1d6); }
body[data-theme="glass"][data-paper="sky"] { --surface: rgba(255,255,255,.42); --bg: linear-gradient(135deg, #cfe4ff, #e6d9ff 50%, #d6f3ff); }
body[data-theme="glass"][data-paper="lavender"] { --surface: rgba(255,255,255,.4); --bg: linear-gradient(135deg, #e6d9ff, #ffd6f0 50%, #d9ecff); }
body[data-theme="glass"][data-paper="pearl"] { --surface: rgba(255,255,255,.45); }
body[data-theme="glass"] .widget, body[data-theme="glass"] .card, body[data-theme="glass"] .nav, body[data-theme="glass"] .modal, body[data-theme="glass"] .toast, body[data-theme="glass"] .entry .sheet, body[data-theme="glass"] .dump { background: var(--surface); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); border: 1px solid rgba(255,255,255,.65); }
body[data-theme="glass"] .widget::after { display: none; }
body[data-theme="glass"] .w-head h3, body[data-theme="glass"] .badge-title, body[data-theme="glass"] .zone-h h3 { background: rgba(255,255,255,.55); border: 1px solid rgba(255,255,255,.8); color: var(--accent-ink); }
body[data-theme="glass"] .badge-title::before, body[data-theme="glass"] .badge-title::after { color: var(--accent); }
body[data-theme="glass"] .row { background: rgba(255,255,255,.45); border: 1px solid rgba(255,255,255,.7); border-radius: 16px; margin-bottom: 6px; }
body[data-theme="glass"] .check { background: rgba(255,255,255,.7); border-radius: 50%; }
body[data-theme="glass"] .btn { background: linear-gradient(135deg, #a78bfa, #8b6ee8); box-shadow: 0 8px 20px rgba(90, 68, 184, .3), inset 0 1px 0 rgba(255,255,255,.5); }
body[data-theme="glass"] .btn.soft, body[data-theme="glass"] .btn.ghost { background: rgba(255,255,255,.5); color: var(--accent-ink); border: 1px solid rgba(255,255,255,.7); }
body[data-theme="glass"] .chip, body[data-theme="glass"] .in, body[data-theme="glass"] .seg, body[data-theme="glass"] .filters button, body[data-theme="glass"] .store-tabs button, body[data-theme="glass"] .item, body[data-theme="glass"] .pcard, body[data-theme="glass"] .totals .tt { background: rgba(255,255,255,.55); border-color: rgba(255,255,255,.8); }
body[data-theme="glass"] .thumb { border-color: rgba(255,255,255,.9); }
body[data-theme="glass"] .motif { opacity: .7; }

/* ===== 7. Pixel World (Minecraft / Roblox feel: blocky, chunky, 8-bit) ===== */
body[data-theme="pixel"] { --font-display: "Press Start 2P", "Silkscreen", monospace; --font-body: "VT323", "Silkscreen", monospace; --font-hand: "Silkscreen", monospace; --accent: #3fa34d; --accent-ink: #1f6b2a; --accent-soft: #d8f3c9; --accent-soft-2: #a6e08a; --ink: #1e1e2a; --ink-2: #3c3c4e; --ink-3: #6b6b80; --line: rgba(30,30,42,.3); --line-2: rgba(30,30,42,.55); --r: 0px; --r-sm: 0px; --border: none; --shadow: 6px 6px 0 #1e1e2a; --shadow-2: 10px 10px 0 #1e1e2a; --bg-pattern: none; --tilt: 0deg; font-size: 19px; }
body[data-theme="pixel"][data-paper="blush"] { --surface: #e9f7df; --bg: #7ec9ff; --row: #fff; }
body[data-theme="pixel"][data-paper="sky"] { --surface: #e3eefc; --bg: #5fb0ff; --row: #fff; }
body[data-theme="pixel"][data-paper="butter"] { --surface: #fff5c2; --bg: #8ed16a; --row: #fff; }
body[data-theme="pixel"] { --bg-pattern: linear-gradient(0deg, #5db24a 0 120px, transparent 120px), repeating-linear-gradient(90deg, rgba(255,255,255,.08) 0 24px, transparent 24px 48px), repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 24px, transparent 24px 48px); background-position: 0 100%, 0 0, 0 0; background-repeat: no-repeat, repeat, repeat; }
body[data-theme="pixel"] .widget, body[data-theme="pixel"] .card, body[data-theme="pixel"] .modal, body[data-theme="pixel"] .entry .sheet, body[data-theme="pixel"] .dump, body[data-theme="pixel"] .nav, body[data-theme="pixel"] .btn, body[data-theme="pixel"] .in, body[data-theme="pixel"] .chip, body[data-theme="pixel"] .pcard, body[data-theme="pixel"] .item, body[data-theme="pixel"] .prod, body[data-theme="pixel"] .toast { border-radius: 0 !important; border: 4px solid #1e1e2a; image-rendering: pixelated; }
body[data-theme="pixel"] .widget::after { display: none; }
body[data-theme="pixel"] .widget, body[data-theme="pixel"] .card { box-shadow: 6px 6px 0 #1e1e2a; }
body[data-theme="pixel"] .w-head h3, body[data-theme="pixel"] .badge-title, body[data-theme="pixel"] .zone-h h3 { background: #1e1e2a; color: #d8f3c9; border-radius: 0; font-size: 13px; letter-spacing: 0; padding: 8px 12px; text-transform: uppercase; }
body[data-theme="pixel"] .badge-title { font-size: 16px; } body[data-theme="pixel"] .badge-title::before, body[data-theme="pixel"] .badge-title::after { display: none; }
body[data-theme="pixel"] .slogan { font-size: 14px; text-transform: uppercase; letter-spacing: 1px; }
body[data-theme="pixel"] .row { border-radius: 0; background: #fff; border: 3px solid #1e1e2a; margin-bottom: 8px; }
body[data-theme="pixel"] .row .title { font-size: 22px; line-height: 1; }
body[data-theme="pixel"] .check { border-radius: 0; border: 3px solid #1e1e2a; background: #fff; } body[data-theme="pixel"] .check.on { background: #3fa34d; border-color: #1e1e2a; }
body[data-theme="pixel"] .thumb { border-radius: 0; border: 3px solid #1e1e2a; transform: none; box-shadow: 3px 3px 0 #1e1e2a; image-rendering: pixelated; }
body[data-theme="pixel"] .row:nth-child(even) .thumb { transform: none; }
body[data-theme="pixel"] .btn { box-shadow: 4px 4px 0 #1e1e2a; font-family: "Press Start 2P", monospace; font-size: 11px; background: #3fa34d; }
body[data-theme="pixel"] .btn:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 #1e1e2a; }
body[data-theme="pixel"] .btn.soft, body[data-theme="pixel"] .btn.ghost { background: #fff; color: #1e1e2a; }
body[data-theme="pixel"] .nav button { font-family: "Silkscreen", monospace; font-size: 10px; }
body[data-theme="pixel"] .progress { border-radius: 0; border: 3px solid #1e1e2a; height: 16px; } body[data-theme="pixel"] .progress i { border-radius: 0; background: repeating-linear-gradient(90deg, #3fa34d 0 12px, #2f8a3c 12px 16px); }
body[data-theme="pixel"] .weekdots span { border-radius: 0; border: 2px solid #1e1e2a; } body[data-theme="pixel"] .weekdots span.on { background: #3fa34d; }
body[data-theme="pixel"] .daynav button { border-radius: 0; border: 3px solid #1e1e2a; background: #fff; }
body[data-theme="pixel"] .motif { display: none; }
body[data-theme="pixel"] .greet .hi { font-size: 13px; } body[data-theme="pixel"] .brand { font-size: 14px; }

/* ================= MINIMAL — deep navy cards on a lilac sky, rounded chips, pink progress bars ================= */
body[data-theme="minimal"] { --font-display: "Quicksand", "Fredoka", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Quicksand", sans-serif; --accent: #b39cff; --accent-ink: #e4daff; --accent-soft: rgba(255,255,255,.10); --accent-soft-2: rgba(255,255,255,.18); --ink: #f3f1ff; --ink-2: #cfcbe8; --ink-3: #9d98c2; --line: rgba(255,255,255,.14); --line-2: rgba(255,255,255,.22); --r: 24px; --r-sm: 14px; --border: none; --shadow: 0 14px 40px rgba(40, 30, 90, .28); --shadow-2: 0 22px 60px rgba(40, 30, 90, .4); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.06); --urgent: #ff8aa6; --high: #ffc76b; --normal: #7fb6ff; --low: #8e89b8; --accent-2: #f29ac2; --on-accent: #1f1d3a; --nav-bg: rgba(43,42,76,.92); --check-line: #8a84c9; --btn-glow: rgba(179,156,255,.35); }
body[data-theme="minimal"][data-paper="lavender"], body[data-theme="minimal"][data-paper="blush"] { --surface: #2b2a4c; --bg: linear-gradient(160deg, #9d9bf7, #c7b9ff 55%, #b9c6ff); }
body[data-theme="minimal"][data-paper="sky"] { --surface: #26304f; --bg: linear-gradient(160deg, #8fb3ff, #cfe0ff 60%, #d9d1ff); }
body[data-theme="minimal"][data-paper="matcha"] { --surface: #27343a; --bg: linear-gradient(160deg, #a7d8c5, #d3f0e3 60%, #cfe9ff); }
body[data-theme="minimal"][data-paper="peach"] { --surface: #3a2b3c; --bg: linear-gradient(160deg, #ffb7a7, #ffd9c9 60%, #e8c9ff); }
body.dark-look .widget, body.dark-look .card, body.dark-look .modal, body.dark-look .dump, body.dark-look .entry .sheet { background: var(--surface); color: var(--ink); }
body.dark-look .widget::after { display: none; }
body.dark-look .nav { background: var(--nav-bg); backdrop-filter: blur(12px); border-top: 1px solid rgba(255,255,255,.1); } body.dark-look .nav button { color: var(--ink-3); } body.dark-look .nav button.on { color: #fff; }
body.dark-look .w-head h3, body.dark-look .badge-title, body.dark-look .dayhead { background: transparent; color: var(--accent-ink); letter-spacing: .08em; text-transform: uppercase; font-size: 14px; font-family: var(--font-display); font-weight: 700; }
body.dark-look .row { background: var(--row); border: 0; border-radius: 14px; margin-bottom: 6px; padding: 10px 10px; }
body.dark-look .row .title { color: var(--ink); }
body.dark-look .row.done .title { color: var(--ink-3); }
body.dark-look .check { width: 26px; height: 26px; border-radius: 9px; border: 2px solid var(--check-line); background: transparent; }
body.dark-look .check.on { background: var(--accent); border-color: var(--accent); }
body.dark-look .chip { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); color: var(--ink-2); }
body.dark-look .seg, body.dark-look .in, body.dark-look .timebtn, body.dark-look .quickbar .spb { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: var(--ink); }
body.dark-look .seg button { color: var(--ink-2); } body.dark-look .seg button.on { background: var(--accent); color: var(--on-accent); }
body.dark-look .btn { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: var(--on-accent); box-shadow: 0 10px 24px var(--btn-glow); }
body.dark-look .btn.soft { background: rgba(255,255,255,.1); color: var(--ink); box-shadow: none; } body.dark-look .btn.ghost { color: var(--ink-2); }
body.dark-look .progress { height: 8px; background: rgba(255,255,255,.12); border: 0; } body.dark-look .progress i { background: linear-gradient(90deg, var(--accent-2), var(--accent)); }
body.dark-look .top .greet .sub, body.dark-look .brand { color: #fff; } body.dark-look .now span, body.dark-look .wallet span { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.35); color: #fff; }
body.dark-look .w-banner .txt.plain { color: #fff; } body.dark-look .w-banner .slogan { color: var(--ink-2); }
body.dark-look .modal-x { background: rgba(255,255,255,.12); color: #fff; }
body.dark-look .feel, body.dark-look .fslot, body.dark-look .of-outfit, body.dark-look .prod { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); color: var(--ink); }
body.dark-look .toast { background: var(--surface); color: #fff; }

/* ================= NIGHT MODE — darkens any look ================= */
body.night:not(.dark-look):not(.own-night) { --surface: #221f36; --row: rgba(255,255,255,.06); --ink: #f3f1ff; --ink-2: #cfcbe8; --ink-3: #9d98c2; --line: rgba(255,255,255,.14); --line-2: rgba(255,255,255,.22); --accent-soft: rgba(255,255,255,.1); --accent-soft-2: rgba(255,255,255,.18); --accent-ink: #e4daff; --shadow: 0 14px 40px rgba(0,0,0,.35); --shadow-2: 0 22px 60px rgba(0,0,0,.5); --bg: linear-gradient(160deg, #1a1830, #2b2650 60%, #1f2a44); --bg-pattern: none; }
body.night:not(.dark-look):not(.own-night) .widget, body.night:not(.dark-look):not(.own-night) .card, body.night:not(.dark-look):not(.own-night) .modal, body.night:not(.dark-look):not(.own-night) .dump, body.night:not(.dark-look):not(.own-night) .entry .sheet, body.night:not(.dark-look):not(.own-night) .nav { background: var(--surface); color: var(--ink); }
body.night:not(.dark-look):not(.own-night) .row { background: var(--row); }
body.night:not(.dark-look):not(.own-night) .in, body.night:not(.dark-look):not(.own-night) .seg, body.night:not(.dark-look):not(.own-night) .timebtn, body.night:not(.dark-look):not(.own-night) .chip, body.night:not(.dark-look):not(.own-night) .check, body.night:not(.dark-look):not(.own-night) .notebar, body.night:not(.dark-look):not(.own-night) .quickbar .spb { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: var(--ink); }
body.night:not(.dark-look):not(.own-night) .w-head h3, body.night:not(.dark-look):not(.own-night) .badge-title { background: rgba(255,255,255,.1); color: var(--accent-ink); }
body.night:not(.dark-look):not(.own-night) .nav button { color: var(--ink-3); } body.night:not(.dark-look):not(.own-night) .nav button.on { color: #fff; }
body.night:not(.dark-look):not(.own-night) .brand, body.night:not(.dark-look):not(.own-night) .greet .sub, body.night:not(.dark-look):not(.own-night) .greet .hi { color: #fff; }
body.night:not(.dark-look):not(.own-night) .now span, body.night:not(.dark-look):not(.own-night) .wallet span { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.25); color: #fff; }
body.night:not(.dark-look):not(.own-night) .toast, body.night:not(.dark-look):not(.own-night) .cloudpill { background: #2b2a4c; color: #fff; }
body.night img.bgm, body.night .bgvideo { filter: brightness(.7); }

/* ================= GLITCH — RGB split, scanlines, mono (Wave 138) ================= */
body[data-theme="glitch"] { --font-display: "JetBrains Mono", ui-monospace, monospace; --font-body: "JetBrains Mono", ui-monospace, monospace; --font-hand: "JetBrains Mono", monospace; --accent: #00b4c4; --accent-2: #e22bb8; --on-accent: #fff; --accent-ink: #0b7f8c; --accent-soft: rgba(0,180,196,.12); --accent-soft-2: rgba(0,180,196,.22); --ink: #14141f; --ink-2: #3c3c52; --ink-3: #6c6c88; --line: #d8d8e6; --line-2: #c4c4d6; --r: 12px; --r-sm: 8px; --border: none; --shadow: 3px 0 0 rgba(0,180,196,.45), -3px 0 0 rgba(226,43,184,.45), 0 12px 30px rgba(20,20,31,.1); --shadow-2: 4px 0 0 rgba(0,180,196,.5), -4px 0 0 rgba(226,43,184,.5), 0 24px 60px rgba(20,20,31,.18); --bg-pattern: none; --tilt: 0deg; --row: #f1f1f8; --surface: #fff; --bg: #f4f4fb; --urgent: #e22bb8; --high: #d9a400; --normal: #00b4c4; --low: #6c6c88; }
body[data-theme="glitch"]:not(.night)::after { background: repeating-linear-gradient(0deg, rgba(20,20,31,.035) 0 1px, transparent 1px 3px); }
body[data-theme="glitch"]:not(.night) .greet .hi, body[data-theme="glitch"]:not(.night) .brand, body[data-theme="glitch"]:not(.night) .w-banner .txt.plain { text-shadow: -2px 0 rgba(226,43,184,.75), 2px 0 rgba(0,180,196,.75); }
body[data-theme="glitch"]:not(.night) .widget { outline-color: rgba(0,180,196,.3); }
body[data-theme="glitch"].night { --font-display: "JetBrains Mono", ui-monospace, monospace; --font-body: "JetBrains Mono", ui-monospace, monospace; --font-hand: "JetBrains Mono", monospace; --accent: #00f0ff; --accent-2: #ff2bd6; --on-accent: #0b0b12; --accent-ink: #9ff7ff; --accent-soft: rgba(0,240,255,.10); --accent-soft-2: rgba(0,240,255,.2); --ink: #f2f2f7; --ink-2: #c9c9d8; --ink-3: #9a9ab4; --line: #2a2a3d; --line-2: #3a3a52; --r: 12px; --r-sm: 8px; --border: none; --shadow: 3px 0 0 rgba(0,240,255,.5), -3px 0 0 rgba(255,43,214,.5), 0 16px 40px rgba(0,0,0,.5); --shadow-2: 4px 0 0 rgba(0,240,255,.6), -4px 0 0 rgba(255,43,214,.6), 0 24px 60px rgba(0,0,0,.6); --bg-pattern: none; --tilt: 0deg; --row: #1a1a28; --surface: #14141f; --nav-bg: rgba(11,11,18,.94); --check-line: #5c5c7a; --btn-glow: rgba(0,240,255,.25); --bg: #0b0b12; --urgent: #ff2bd6; --high: #ffe600; --normal: #00f0ff; --low: #9a9ab4; }
body[data-theme="glitch"]::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 9998; background: repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 3px); }
body[data-theme="glitch"] .widget { outline: 1px solid rgba(0,240,255,.22); outline-offset: 3px; }
body[data-theme="glitch"] .w-head h3, body[data-theme="glitch"] .badge-title, body[data-theme="glitch"] .dayhead { text-transform: uppercase; letter-spacing: .12em; font-size: 14px; } body[data-theme="glitch"] .w-head h3::before { content: "> "; color: var(--accent-2); }
body[data-theme="glitch"] .greet .hi, body[data-theme="glitch"] .w-banner .txt.plain, body[data-theme="glitch"] .brand { text-shadow: -2px 0 #ff2bd6, 2px 0 #00f0ff; }
body[data-theme="glitch"] .w-banner .txt.glitter, body[data-theme="glitch"] .w-banner .txt.still { background: linear-gradient(90deg, #00f0ff, #fff, #ff2bd6); -webkit-background-clip: text; background-clip: text; }
body[data-theme="glitch"] .btn { border-radius: 6px; } body[data-theme="glitch"] .chip, body[data-theme="glitch"] .seg button, body[data-theme="glitch"] .in { border-radius: 6px; }
@media (prefers-reduced-motion: no-preference) { body[data-theme="glitch"] .greet .hi, body[data-theme="glitch"] .w-banner .txt { animation: glitchIn .32s steps(3) 1; } body[data-theme="glitch"] .greet .hi:hover { animation: glitchIn .32s steps(3) 1; } }
@keyframes glitchIn { 0% { clip-path: inset(0 0 60% 0); transform: translate(-3px, 0); } 34% { clip-path: inset(40% 0 20% 0); transform: translate(3px, 0); } 67% { clip-path: inset(70% 0 0 0); transform: translate(-2px, 0); } 100% { clip-path: none; transform: none; } }

/* ================= NEON — near-black, pink and cyan glow ================= */
body[data-theme="neon"] { --font-display: "Quicksand", "Fredoka", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Quicksand", sans-serif; --accent: #ff4d8d; --accent-2: #0fb5cc; --on-accent: #fff; --accent-ink: #c2185b; --accent-soft: rgba(255,77,141,.12); --accent-soft-2: rgba(255,77,141,.22); --ink: #1b1430; --ink-2: #4a3f6b; --ink-3: #7d6fa3; --line: #e6ddf7; --line-2: #d3c6f0; --r: 18px; --r-sm: 12px; --border: none; --shadow: 0 0 0 1px rgba(255,77,141,.35), 0 0 14px rgba(255,77,141,.16), 0 10px 30px rgba(120,80,180,.12); --shadow-2: 0 0 0 1px rgba(15,181,204,.4), 0 0 18px rgba(15,181,204,.2), 0 24px 60px rgba(120,80,180,.18); --bg-pattern: none; --tilt: 0deg; --row: #f6f2ff; --surface: #fff; --bg: linear-gradient(180deg, #f7f3ff, #fdf6fb); --urgent: #ff4d8d; --high: #e59a1c; --normal: #0fb5cc; --low: #7d6fa3; }
body[data-theme="neon"]:not(.night)::before { background: radial-gradient(60% 40% at 50% 0%, rgba(192,132,252,.22), transparent 70%), linear-gradient(transparent 97%, rgba(60,40,100,.05) 97%) 0 0 / 100% 44px, linear-gradient(90deg, transparent 97%, rgba(60,40,100,.05) 97%) 0 0 / 44px 100%; }
body[data-theme="neon"]:not(.night) .widget { box-shadow: var(--shadow), inset 0 0 18px rgba(255,77,141,.05); } body[data-theme="neon"]:not(.night) .widget:nth-child(even) { box-shadow: 0 0 0 1px rgba(15,181,204,.35), 0 0 14px rgba(15,181,204,.16), 0 10px 30px rgba(120,80,180,.12), inset 0 0 18px rgba(15,181,204,.05); }
body[data-theme="neon"]:not(.night) .widget:nth-child(even) .w-head h3, body[data-theme="neon"]:not(.night) .widget:nth-child(even) .badge-title { color: #0b8ea0; }
body[data-theme="neon"]:not(.night) .greet .hi, body[data-theme="neon"]:not(.night) .w-banner .txt.plain { color: #c2185b; text-shadow: 0 0 10px rgba(255,77,141,.35); }
body[data-theme="neon"]:not(.night) .nav button.on { color: #c2185b; text-shadow: 0 0 10px rgba(15,181,204,.5); animation: none; }
body[data-theme="neon"].night { --font-display: "Quicksand", "Fredoka", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Quicksand", sans-serif; --accent: #ff4d8d; --accent-2: #22d3ee; --on-accent: #0a0716; --accent-ink: #ffb3cf; --accent-soft: rgba(255,77,141,.12); --accent-soft-2: rgba(255,77,141,.22); --ink: #f8f7ff; --ink-2: #cdc3ee; --ink-3: #a393d9; --line: #34265e; --line-2: #4a378a; --r: 18px; --r-sm: 12px; --border: none; --shadow: 0 0 0 1px rgba(255,77,141,.45), 0 0 14px rgba(255,77,141,.26), 0 0 40px rgba(255,77,141,.12); --shadow-2: 0 0 0 1px rgba(34,211,238,.5), 0 0 18px rgba(34,211,238,.3), 0 24px 80px rgba(192,132,252,.22); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.05); --surface: #111126; --nav-bg: rgba(7,7,17,.92); --check-line: #6b56b3; --btn-glow: rgba(255,77,141,.45); --bg: linear-gradient(180deg, #070711, #0d0b1f); --urgent: #ff4d8d; --high: #ffb347; --normal: #22d3ee; --low: #a393d9; }
body[data-theme="neon"]::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(60% 40% at 50% 0%, rgba(192,132,252,.28), transparent 70%), linear-gradient(transparent 97%, rgba(255,255,255,.045) 97%) 0 0 / 100% 44px, linear-gradient(90deg, transparent 97%, rgba(255,255,255,.045) 97%) 0 0 / 44px 100%; }
body[data-theme="neon"] .widget { box-shadow: var(--shadow), inset 0 0 18px rgba(255,77,141,.08); } body[data-theme="neon"] .widget:nth-child(even) { box-shadow: 0 0 0 1px rgba(34,211,238,.45), 0 0 14px rgba(34,211,238,.26), 0 0 40px rgba(34,211,238,.12), inset 0 0 18px rgba(34,211,238,.08); }
body[data-theme="neon"] .widget:nth-child(even) .w-head h3, body[data-theme="neon"] .widget:nth-child(even) .badge-title { color: #9ff0fb; }
body[data-theme="neon"] .greet .hi, body[data-theme="neon"] .w-banner .txt.plain { color: #fff; text-shadow: 0 0 6px rgba(255,77,141,.9), 0 0 18px rgba(255,77,141,.55), 0 0 40px rgba(255,77,141,.3); }
body[data-theme="neon"] .w-banner .txt.glitter, body[data-theme="neon"] .w-banner .txt.still { background: linear-gradient(90deg, #ff4d8d, #ffd1e3, #22d3ee, #ff4d8d); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 0 8px rgba(255,77,141,.6)); }
body[data-theme="neon"] .nav button.on { color: #fff; text-shadow: 0 0 10px rgba(34,211,238,.9), 0 0 22px rgba(34,211,238,.5); }
@media (prefers-reduced-motion: no-preference) { body[data-theme="neon"] .nav button.on { animation: neonBreathe 3.5s ease-in-out infinite; } }
@keyframes neonBreathe { 0%, 100% { text-shadow: 0 0 8px rgba(34,211,238,.6), 0 0 18px rgba(34,211,238,.25); } 50% { text-shadow: 0 0 12px rgba(34,211,238,1), 0 0 30px rgba(34,211,238,.5); } }

/* ================= SHATTERED GLASS — frosted panes with a corner crack ================= */
body[data-theme="shatter"] { --font-display: "Inter", "Nunito", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Inter", sans-serif; --accent: #4aa8e8; --accent-2: #f06292; --on-accent: #fff; --accent-ink: #2b6fa8; --accent-soft: rgba(255,255,255,.55); --accent-soft-2: rgba(255,255,255,.75); --ink: #1b2438; --ink-2: #3f4d66; --ink-3: #6f7f99; --line: rgba(27,36,56,.14); --line-2: rgba(27,36,56,.24); --r: 22px; --r-sm: 14px; --border: none; --shadow: 0 12px 40px rgba(27,36,56,.12), inset 0 0 0 1px rgba(255,255,255,.75); --shadow-2: 0 24px 70px rgba(27,36,56,.2), inset 0 0 0 1px rgba(255,255,255,.85); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.6); --surface: rgba(255,255,255,.55); --bg: radial-gradient(40% 35% at 18% 18%, rgba(255,160,200,.45), transparent 62%), radial-gradient(45% 40% at 82% 72%, rgba(120,190,255,.45), transparent 62%), linear-gradient(160deg, #eef3fb, #dfe8f7); --urgent: #f06292; --high: #e5a21c; --normal: #4aa8e8; --low: #6f7f99; }
body[data-theme="shatter"]:not(.night) .widget::after { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke-linecap='round'%3E%3Cg stroke='rgba(255,255,255,.8)' stroke-width='1.2' transform='translate(1 1)'%3E%3Cpath d='M200 0 150 60 120 66M150 60 130 112 138 152M130 112 78 122M200 0 162 22 112 30 92 62M162 22 170 72 200 92M112 30 100 8'/%3E%3C/g%3E%3Cg stroke='rgba(27,36,56,.42)' stroke-width='1.1'%3E%3Cpath d='M200 0 150 60 120 66M150 60 130 112 138 152M130 112 78 122M200 0 162 22 112 30 92 62M162 22 170 72 200 92M112 30 100 8'/%3E%3C/g%3E%3Cpath d='M200 0 150 60 162 22Z' fill='rgba(255,255,255,.25)'/%3E%3Cpath d='M162 22 170 72 200 92 200 0Z' fill='rgba(255,255,255,.18)'/%3E%3C/g%3E%3C/svg%3E") no-repeat top right / 190px 190px; }
body[data-theme="shatter"]:not(.night) .nav { background: rgba(255,255,255,.6); }
body[data-theme="shatter"].night { --font-display: "Inter", "Nunito", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Inter", sans-serif; --accent: #9fd8ff; --accent-2: #ffc6e0; --on-accent: #0e1420; --accent-ink: #dff1ff; --accent-soft: rgba(255,255,255,.12); --accent-soft-2: rgba(255,255,255,.2); --ink: #f4f8ff; --ink-2: #c6d3e6; --ink-3: #9fb1cc; --line: rgba(255,255,255,.28); --line-2: rgba(255,255,255,.4); --r: 22px; --r-sm: 14px; --border: none; --shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.28); --shadow-2: 0 24px 70px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.4); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.08); --surface: rgba(255,255,255,.10); --nav-bg: rgba(14,20,32,.62); --check-line: rgba(255,255,255,.6); --btn-glow: rgba(159,216,255,.3); --bg: radial-gradient(40% 35% at 18% 18%, rgba(255,198,224,.38), transparent 62%), radial-gradient(45% 40% at 82% 72%, rgba(159,216,255,.32), transparent 62%), linear-gradient(160deg, #0e1420, #1b2438); --urgent: #ffc6e0; --high: #ffe6a3; --normal: #9fd8ff; --low: #9fb1cc; }
body[data-theme="shatter"] .widget, body[data-theme="shatter"] .card, body[data-theme="shatter"] .modal, body[data-theme="shatter"] .nav { backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); }
body[data-theme="shatter"] .widget { overflow: hidden; } body[data-theme="shatter"] .widget::after { display: block; content: ""; inset: 0; border: 0; border-radius: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke-linecap='round'%3E%3Cg stroke='rgba(0,0,0,.28)' stroke-width='1.2' transform='translate(1 1)'%3E%3Cpath d='M200 0 150 60 120 66M150 60 130 112 138 152M130 112 78 122M200 0 162 22 112 30 92 62M162 22 170 72 200 92M112 30 100 8'/%3E%3C/g%3E%3Cg stroke='rgba(255,255,255,.62)' stroke-width='1.1'%3E%3Cpath d='M200 0 150 60 120 66M150 60 130 112 138 152M130 112 78 122M200 0 162 22 112 30 92 62M162 22 170 72 200 92M112 30 100 8'/%3E%3C/g%3E%3Cpath d='M200 0 150 60 162 22Z' fill='rgba(255,255,255,.07)'/%3E%3Cpath d='M162 22 170 72 200 92 200 0Z' fill='rgba(255,255,255,.05)'/%3E%3C/g%3E%3C/svg%3E") no-repeat top right / 190px 190px; opacity: .9; }
body[data-theme="shatter"] .widget > * { position: relative; z-index: 1; }
body[data-theme="shatter"] .w-head h3, body[data-theme="shatter"] .badge-title, body[data-theme="shatter"] .dayhead { letter-spacing: .12em; font-weight: 500; text-transform: uppercase; font-size: 13.5px; }
body[data-theme="shatter"] .greet .hi { letter-spacing: .02em; font-weight: 500; }
@media (prefers-reduced-motion: no-preference) { body[data-theme="shatter"] .widget::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.08) 50%, transparent 60%); background-size: 300% 100%; animation: glassSweep 9s linear infinite; } }
@keyframes glassSweep { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* ================= FROSTED GLASS — the same panes, no crack ================= */
body[data-theme="frosted"] { --font-display: "Inter", "Nunito", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Inter", sans-serif; --accent: #4aa8e8; --accent-2: #f06292; --on-accent: #fff; --accent-ink: #2b6fa8; --accent-soft: rgba(255,255,255,.55); --accent-soft-2: rgba(255,255,255,.75); --ink: #1b2438; --ink-2: #3f4d66; --ink-3: #6f7f99; --line: rgba(27,36,56,.14); --line-2: rgba(27,36,56,.24); --r: 22px; --r-sm: 14px; --border: none; --shadow: 0 12px 40px rgba(27,36,56,.12), inset 0 0 0 1px rgba(255,255,255,.75); --shadow-2: 0 24px 70px rgba(27,36,56,.2), inset 0 0 0 1px rgba(255,255,255,.85); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.6); --surface: rgba(255,255,255,.55); --bg: radial-gradient(40% 35% at 18% 18%, rgba(255,160,200,.45), transparent 62%), radial-gradient(45% 40% at 82% 72%, rgba(120,190,255,.45), transparent 62%), linear-gradient(160deg, #eef3fb, #dfe8f7); --urgent: #f06292; --high: #e5a21c; --normal: #4aa8e8; --low: #6f7f99; }
body[data-theme="frosted"] .widget::after { display: none; }
body[data-theme="frosted"]:not(.night) .nav { background: rgba(255,255,255,.6); }
body[data-theme="frosted"].night { --font-display: "Inter", "Nunito", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Inter", sans-serif; --accent: #9fd8ff; --accent-2: #ffc6e0; --on-accent: #0e1420; --accent-ink: #dff1ff; --accent-soft: rgba(255,255,255,.12); --accent-soft-2: rgba(255,255,255,.2); --ink: #f4f8ff; --ink-2: #c6d3e6; --ink-3: #9fb1cc; --line: rgba(255,255,255,.28); --line-2: rgba(255,255,255,.4); --r: 22px; --r-sm: 14px; --border: none; --shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.28); --shadow-2: 0 24px 70px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.4); --bg-pattern: none; --tilt: 0deg; --row: rgba(255,255,255,.08); --surface: rgba(255,255,255,.10); --nav-bg: rgba(14,20,32,.62); --check-line: rgba(255,255,255,.6); --btn-glow: rgba(159,216,255,.3); --bg: radial-gradient(40% 35% at 18% 18%, rgba(255,198,224,.38), transparent 62%), radial-gradient(45% 40% at 82% 72%, rgba(159,216,255,.32), transparent 62%), linear-gradient(160deg, #0e1420, #1b2438); --urgent: #ffc6e0; --high: #ffe6a3; --normal: #9fd8ff; --low: #9fb1cc; }
body[data-theme="frosted"] .widget, body[data-theme="frosted"] .card, body[data-theme="frosted"] .modal, body[data-theme="frosted"] .nav { backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); }
body[data-theme="frosted"] .widget { overflow: hidden; } body[data-theme="frosted"] .widget::after { display: none; }
body[data-theme="frosted"] .widget > * { position: relative; z-index: 1; }
body[data-theme="frosted"] .w-head h3, body[data-theme="frosted"] .badge-title, body[data-theme="frosted"] .dayhead { letter-spacing: .12em; font-weight: 500; text-transform: uppercase; font-size: 13.5px; }
body[data-theme="frosted"] .greet .hi { letter-spacing: .02em; font-weight: 500; }
@media (prefers-reduced-motion: no-preference) { body[data-theme="frosted"] .widget::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.08) 50%, transparent 60%); background-size: 300% 100%; animation: glassSweep 9s linear infinite; } }
@keyframes glassSweep { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* ================= FILM STRIP — warm dark, sprockets, grain, serif italic ================= */
body[data-theme="film"] { --font-display: "Playfair Display", Georgia, serif; --font-body: "Nunito", sans-serif; --font-hand: "Special Elite", monospace; --accent: #d98f00; --accent-2: #c8631f; --on-accent: #fff; --accent-ink: #8a5a00; --accent-soft: rgba(217,143,0,.12); --accent-soft-2: rgba(217,143,0,.22); --ink: #2a2520; --ink-2: #5a5046; --ink-3: #8a7d6e; --line: rgba(42,37,32,.14); --line-2: rgba(42,37,32,.24); --r: 8px; --r-sm: 5px; --border: none; --shadow: 0 14px 40px rgba(42,37,32,.14); --shadow-2: 0 22px 60px rgba(42,37,32,.22); --bg-pattern: none; --tilt: 0deg; --row: rgba(42,37,32,.05); --surface: #fff8ea; --bg: #f3ead8; --urgent: #e8603c; --high: #d98f00; --normal: #5a5046; --low: #8a7d6e; }
body[data-theme="film"]:not(.night) .widget::after { background: radial-gradient(4px 4px at 50% 50%, #f3ead8 98%, transparent) 0 8px / 16px 24px repeat-y, radial-gradient(4px 4px at 50% 50%, #f3ead8 98%, transparent) 100% 8px / 16px 24px repeat-y, linear-gradient(#2a2520, #2a2520) left / 16px 100% no-repeat, linear-gradient(#2a2520, #2a2520) right / 16px 100% no-repeat; }
body[data-theme="film"]:not(.night)::before { background: radial-gradient(80% 70% at 50% 40%, transparent 55%, rgba(42,37,32,.18)); }
body[data-theme="film"]:not(.night) .nav { background: rgba(243,234,216,.95); }
body[data-theme="film"].night { --font-display: "Playfair Display", Georgia, serif; --font-body: "Nunito", sans-serif; --font-hand: "Special Elite", monospace; --accent: #f2a900; --accent-2: #c8631f; --on-accent: #14110f; --accent-ink: #ffd36b; --accent-soft: rgba(242,169,0,.12); --accent-soft-2: rgba(242,169,0,.22); --ink: #f3ead8; --ink-2: #d6cbb6; --ink-3: #a99b85; --line: rgba(243,234,216,.14); --line-2: rgba(243,234,216,.24); --r: 8px; --r-sm: 5px; --border: none; --shadow: 0 14px 40px rgba(0,0,0,.5); --shadow-2: 0 22px 60px rgba(0,0,0,.6); --bg-pattern: none; --tilt: 0deg; --row: rgba(243,234,216,.06); --surface: #1d1915; --nav-bg: rgba(20,17,15,.95); --check-line: #7a6b57; --btn-glow: rgba(242,169,0,.3); --bg: #14110f; --urgent: #e8603c; --high: #f2a900; --normal: #d6cbb6; --low: #a99b85; }
body[data-theme="film"]::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 9998; opacity: .07; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"); }
body[data-theme="film"]::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1; background: radial-gradient(80% 70% at 50% 40%, transparent 50%, rgba(0,0,0,.55)); }
body[data-theme="film"] .widget { padding-left: 30px; padding-right: 30px; border-radius: 4px; }
body[data-theme="film"] .widget::after { display: block; content: ""; inset: 0; border: 0; border-radius: 4px; background: radial-gradient(4px 4px at 50% 50%, #14110f 98%, transparent) 0 8px / 16px 24px repeat-y, radial-gradient(4px 4px at 50% 50%, #14110f 98%, transparent) 100% 8px / 16px 24px repeat-y, linear-gradient(#0f0d0b, #0f0d0b) left / 16px 100% no-repeat, linear-gradient(#0f0d0b, #0f0d0b) right / 16px 100% no-repeat; }
body[data-theme="film"] .widget > * { position: relative; z-index: 1; }
body[data-theme="film"] .page .widget { counter-increment: frame; } body[data-theme="film"] .page { counter-reset: frame; }
body[data-theme="film"] .w-head h3 { font-style: italic; font-weight: 600; font-size: 19px; letter-spacing: .01em; } body[data-theme="film"] .w-head h3::after { content: counter(frame) "A"; font: 700 12.5px "JetBrains Mono", monospace; color: var(--accent); letter-spacing: .1em; margin-left: 4px; }
body[data-theme="film"] .greet .hi { font-style: italic; font-size: 21px; } body[data-theme="film"] .brand { font-family: var(--font-display); font-style: italic; }
body[data-theme="film"] .w-banner .txt.glitter, body[data-theme="film"] .w-banner .txt.still { background: linear-gradient(90deg, #f2a900, #fff0c2, #c8631f, #f2a900); -webkit-background-clip: text; background-clip: text; }
body[data-theme="film"] .check { border-radius: 3px; } body[data-theme="film"] .btn, body[data-theme="film"] .chip, body[data-theme="film"] .seg button { border-radius: 6px; }

/* ================= EMBROIDERY — linen, felt cards, stitched thread ================= */
body[data-theme="embroidery"] { --font-display: "Baloo 2", "Fredoka", sans-serif; --font-body: "Nunito", sans-serif; --font-hand: "Caveat", cursive; --accent: #c9707e; --accent-ink: #8b4a56; --accent-soft: rgba(201,112,126,.14); --accent-soft-2: rgba(201,112,126,.24); --ink: #4a3b32; --ink-2: #6e5c50; --ink-3: #9a8779; --line: #d9c9b3; --line-2: #c9b79e; --r: 22px; --r-sm: 14px; --border: none; --shadow: 0 10px 26px rgba(90,60,30,.14), inset 0 0 0 1px rgba(255,255,255,.55); --shadow-2: 0 22px 50px rgba(90,60,30,.22); --tilt: 0deg; --row: rgba(255,255,255,.62); --surface: #f6d5d9; --bg: #efe6d6; --bg-pattern: repeating-linear-gradient(0deg, rgba(120,95,60,.055) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(120,95,60,.055) 0 1px, transparent 1px 3px); --urgent: #c9545f; --high: #d99a3c; --normal: #7f9d77; --low: #9a8779; --thread: #c9707e; }
body[data-theme="embroidery"] .widget:nth-child(4n+2) { background: #d5e4d0; --thread: #6e9a63; } body[data-theme="embroidery"] .widget:nth-child(4n+3) { background: #f7e8b8; --thread: #c99a2e; } body[data-theme="embroidery"] .widget:nth-child(4n) { background: #d3e3f2; --thread: #5f8bb5; }
body[data-theme="embroidery"] .widget::after { inset: 7px; border: 2px dashed var(--thread); border-radius: calc(var(--r) - 6px); opacity: .75; box-shadow: inset 0 0 0 3px rgba(255,255,255,.45); }
body[data-theme="embroidery"] .card, body[data-theme="embroidery"] .modal { background: #fbf5ea; position: relative; } body[data-theme="embroidery"] .card::after { content: ""; position: absolute; inset: 7px; border: 2px dashed rgba(201,112,126,.55); border-radius: calc(var(--r) - 6px); pointer-events: none; }
body[data-theme="embroidery"] .w-head h3, body[data-theme="embroidery"] .badge-title { background: #fff; color: var(--thread); border: 1.5px dashed var(--thread); letter-spacing: .02em; }
body[data-theme="embroidery"] .greet .hi { font-family: "Caveat", cursive; font-size: 26px; font-weight: 700; color: #8b4a56; }
body[data-theme="embroidery"] .row { border: 1.5px dashed rgba(74,59,50,.22); }
body[data-theme="embroidery"] .row.done .title { text-decoration: line-through; text-decoration-style: dashed; text-decoration-color: var(--thread); text-decoration-thickness: 2px; }
body[data-theme="embroidery"] .check { border: 2px dashed var(--thread); } body[data-theme="embroidery"] .check.on { background: var(--thread); border-style: solid; }
body[data-theme="embroidery"] .btn { background: var(--thread); box-shadow: 0 6px 16px rgba(74,59,50,.18), inset 0 0 0 2px rgba(255,255,255,.5); } body[data-theme="embroidery"] .btn.soft { background: #fff; color: var(--accent-ink); box-shadow: inset 0 0 0 1.5px var(--line-2); }
body[data-theme="embroidery"] .nav { background: #fbf5ea; border-top: 2px dashed #d9c9b3; }
body[data-theme="embroidery"] .w-banner .txt.glitter, body[data-theme="embroidery"] .w-banner .txt.still { background: linear-gradient(90deg, #c9707e, #e9a2ad, #c99a2e, #6e9a63, #5f8bb5); -webkit-background-clip: text; background-clip: text; }

/* embroidery by night: dark linen, deep felt, light thread */
body[data-theme="embroidery"].night { --ink: #f3e9dc; --ink-2: #d6c8b8; --ink-3: #a89a88; --line: rgba(243,233,220,.18); --line-2: rgba(243,233,220,.28); --surface: #5a3a44; --row: rgba(255,255,255,.08); --bg: #2b2420; --bg-pattern: repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 3px); --accent: #e9a2ad; --accent-ink: #f3b8c2; --accent-soft: rgba(233,162,173,.16); --accent-soft-2: rgba(233,162,173,.28); --accent-2: #9ec59a; --on-accent: #2b2420; --nav-bg: #2b2420; --check-line: #e9a2ad; --btn-glow: rgba(201,112,126,.3); --thread: #f3b8c2; --shadow: 0 10px 26px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.08); }
body[data-theme="embroidery"].night .widget:nth-child(4n+2) { background: #3b4a38; --thread: #b9d8b2; } body[data-theme="embroidery"].night .widget:nth-child(4n+3) { background: #5a4a2a; --thread: #f0d68a; } body[data-theme="embroidery"].night .widget:nth-child(4n) { background: #3a4658; --thread: #b7d0ee; }
body[data-theme="embroidery"].night .card, body[data-theme="embroidery"].night .modal { background: #3a302c; } body[data-theme="embroidery"].night .card::after { border-color: rgba(243,184,194,.5); }
body[data-theme="embroidery"].night .w-head h3, body[data-theme="embroidery"].night .badge-title { background: rgba(0,0,0,.25); }
body[data-theme="embroidery"].night .nav { background: #2b2420; border-top: 2px dashed #5a4a40; }
body[data-theme="embroidery"].night .row { border-color: rgba(243,233,220,.22); } body[data-theme="embroidery"].night .btn.soft { background: rgba(255,255,255,.1); color: var(--ink); }
body[data-theme="embroidery"].night .greet .hi { color: #f3b8c2; }
/* day banners: no white stop in the gradient on a light card */
body[data-theme="glitch"]:not(.night) .w-banner .txt.glitter, body[data-theme="glitch"]:not(.night) .w-banner .txt.still { background: linear-gradient(90deg, #00b4c4, #14141f, #e22bb8, #00b4c4); -webkit-background-clip: text; background-clip: text; }
body[data-theme="neon"]:not(.night) .w-banner .txt.glitter, body[data-theme="neon"]:not(.night) .w-banner .txt.still { background: linear-gradient(90deg, #ff4d8d, #c2185b, #0fb5cc, #ff4d8d); -webkit-background-clip: text; background-clip: text; filter: none; }

/* Wave 170: entry card is pure white on Cute Paper, gingham stays */
body[data-theme="paper"] .entry .sheet { background: #fff; }