:root{--bg: #181310;--panel: rgba(31, 24, 18, .55);--line: rgba(255, 246, 232, .14);--line-soft: rgba(255, 246, 232, .09);--ink: #f4ece0;--ink-dim: #cbbfae;--clay: #c98f63;--clay-hi: #e6bd93;--moss: #b9c98a;--ease-out: cubic-bezier(.23, 1, .32, 1);--ease-in-out: cubic-bezier(.77, 0, .175, 1)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);font-family:DM Sans,system-ui,sans-serif;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:0;height:0}button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;padding:0}input,textarea,select{font-family:inherit}#root{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(100% 80% at 50% 0%,#26201a,#141010)}.phone{width:390px;height:844px;position:relative;overflow:hidden;border-radius:38px;background:#2e2621;box-shadow:0 40px 90px -30px #000000d9,0 0 0 1px #fff0dc17}@media (max-width: 430px),(max-height: 900px){#root{padding:0}.phone{width:100vw;height:100vh;height:100dvh;border-radius:0}}.wall{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.wall-paper{position:absolute;inset:0;background:linear-gradient(170deg,#f3ece0,#dfd2bf 55%,#c9b9a2)}.glow{position:absolute;left:50%;bottom:200px;width:340px;height:340px;transform:translate(-50%);border-radius:50%;background:radial-gradient(circle,#c98f634d,#c98f6300 68%);animation:shimmer 6s ease-in-out infinite}.char-stack{position:absolute;left:50%;bottom:226px;width:340px;aspect-ratio:1024 / 1536;transform:translate(-50%);animation:breathe 5.4s ease-in-out infinite;filter:drop-shadow(0 24px 30px rgba(30,20,12,.5));pointer-events:none}.char-stack.hugging{animation:hugpulse 1.5s cubic-bezier(.34,1.4,.5,1)}.char-stack img{position:absolute;inset:0;width:100%;height:100%}.pill{display:flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:#1c150f80;backdrop-filter:blur(16px);border:1px solid rgba(255,246,232,.16);font:500 12.5px DM Sans,sans-serif;color:var(--ink)}.dot{position:relative;display:block;width:8px;height:8px;flex:none}.dot:before,.dot:after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--moss)}.dot:after{animation:pulse 2s ease-out infinite}.dot.thinking:before,.dot.thinking:after{background:var(--clay-hi)}.dot.speaking:before,.dot.speaking:after{background:var(--clay)}.meter-track{display:block;width:48px;height:5px;border-radius:3px;background:#fff6e838;overflow:hidden}.meter-fill{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#c98f63,#e6bd93);transition:width .7s var(--ease-out)}.rail{position:absolute;right:14px;bottom:336px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px;border-radius:17px;background:#1c150f8c;backdrop-filter:blur(16px);border:1px solid rgba(255,246,232,.15);z-index:6;box-shadow:0 6px 18px -8px #0009}.rail-btn{width:34px;height:34px;border-radius:13px;display:grid;place-items:center;transition:background .18s ease,transform .15s var(--ease-out)}.rail-btn:hover{background:#fff6e81f}.rail-btn:active{transform:scale(.9)}.rail-sep{width:20px;height:1px;background:#fff6e829;margin:2px 0}.rail-hug{width:34px;height:34px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(150deg,#cf9668,#a8663f);box-shadow:0 5px 14px -4px #a8663fcc;animation:bob 3.4s ease-in-out infinite;transition:transform .18s var(--ease-out)}.rail-hug:hover{transform:scale(1.08)}.rail-hug:active{transform:scale(.9)}.hearts{position:absolute;left:0;right:0;bottom:300px;height:1px;pointer-events:none;z-index:5}.hearts span{position:absolute;animation:rise 1.6s ease-out forwards}.chat-panel{position:absolute;left:0;right:0;bottom:92px;padding:0 14px;z-index:5}.chat-card{border-radius:26px;background:var(--panel);backdrop-filter:blur(24px);border:1px solid var(--line);padding:13px 13px 12px;box-shadow:0 -8px 30px -14px #0009}.chat-scroll{display:flex;flex-direction:column;gap:9px;margin-bottom:11px;max-height:226px;overflow-y:auto;padding-right:2px}.msg-me{align-self:flex-end;max-width:78%;padding:9px 14px;border-radius:18px 18px 5px;background:#f6eee2ed;color:#33291f;font:400 13.5px/1.45 system-ui,sans-serif;animation:fadeup .35s var(--ease-out) both;text-wrap:pretty;white-space:pre-wrap}.msg-img{align-self:flex-end;max-width:170px;border-radius:16px 16px 5px;border:1px solid rgba(255,246,232,.2);overflow:hidden;animation:fadeup .35s var(--ease-out) both}.msg-img img{display:block;width:100%}.msg-img-note{align-self:flex-end;font:400 11px DM Sans,sans-serif;color:var(--ink-dim);opacity:.8}.msg-ai{align-self:flex-start;max-width:84%;padding:10px 15px;border-radius:18px 18px 18px 5px;background:#fff7ec21;border:1px solid var(--line);color:#f6efe4;font:400 14.5px/1.5 system-ui,sans-serif;animation:fadeup .35s var(--ease-out) both;text-wrap:pretty;white-space:pre-wrap}.typing{align-self:flex-start;display:flex;gap:4px;padding:8px 12px;border-radius:14px;background:#fff7ec1a}.typing span{width:5px;height:5px;border-radius:50%;background:#e6d9c6;animation:dots 1.2s ease-in-out infinite}.typing span:nth-child(2){animation-delay:.18s}.typing span:nth-child(3){animation-delay:.36s}.speak-chip{align-self:flex-start;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 10px;border-radius:999px;background:#c98f6333;border:1px solid rgba(226,177,132,.28);font:400 11.5px DM Sans,sans-serif;color:#f0dcc4}.wave{display:flex;align-items:flex-end;gap:2.5px;height:12px}.wave span{width:2.5px;height:100%;border-radius:2px;background:var(--clay-hi);transform-origin:50% 100%;animation:wav .85s ease-in-out infinite}.wave span:nth-child(2){animation-delay:.14s}.wave span:nth-child(3){animation-delay:.28s}.wave span:nth-child(4){animation-delay:.42s;background:var(--clay)}.input-row{display:flex;align-items:center;gap:8px}.input-row input[type=text]{flex:1;min-width:0;padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:#fff7ec14;color:var(--ink);font:400 13.5px DM Sans,sans-serif;outline:none}.input-row input[type=text]:focus-visible{border-color:#e6bd938c}.icon-btn{width:38px;height:38px;flex:none;border-radius:999px;display:grid;place-items:center;border:1px solid var(--line);background:#fff7ec14;transition:transform .15s var(--ease-out),background .18s ease}.icon-btn:hover{background:#fff7ec24}.icon-btn:active{transform:scale(.92)}.send-btn{background:linear-gradient(150deg,#cf9668,#a8663f);border:none}.send-btn:disabled{opacity:.45;cursor:default}.img-preview{position:relative;width:46px;height:38px;flex:none;border-radius:12px;overflow:hidden;border:1px solid var(--line)}.img-preview img{width:100%;height:100%;object-fit:cover;display:block}.img-preview button{position:absolute;top:1px;right:1px;width:15px;height:15px;border-radius:50%;background:#140e0abf;color:var(--ink);font-size:9px;line-height:1;display:grid;place-items:center}.nav{position:absolute;left:0;right:0;bottom:0;height:80px;display:flex;align-items:flex-start;justify-content:space-around;padding:10px 8px 0;z-index:7;background:linear-gradient(to top,rgba(20,14,10,.92),rgba(20,14,10,.55) 70%,transparent)}.nav button{display:flex;flex-direction:column;align-items:center;gap:4px;font:500 10.5px DM Sans,sans-serif;color:#f4ece08c;transition:color .18s ease;padding:4px 8px}.nav button.on{color:var(--clay-hi)}.nav button:focus-visible,.rail-btn:focus-visible,.rail-hug:focus-visible,.icon-btn:focus-visible{outline:2px solid rgba(230,189,147,.7);outline-offset:2px}.screen{position:absolute;inset:0;padding:96px 18px 92px;overflow-y:auto;z-index:4;background:linear-gradient(180deg,#18120ddb,#18120df0);animation:panelin .32s var(--ease-out) both}.h1{font:500 22px Newsreader,serif;color:var(--ink);margin:0 0 4px}.sub{font:400 12.5px DM Sans,sans-serif;color:var(--ink-dim);margin:0 0 18px}.card{border-radius:20px;background:#fff7ec0f;border:1px solid var(--line-soft);padding:14px 15px;margin-bottom:12px}.card h3{margin:0 0 10px;font:500 13px DM Sans,sans-serif;color:var(--ink);letter-spacing:.02em}.label{font:500 11px DM Sans,sans-serif;color:var(--ink-dim);letter-spacing:.04em;text-transform:uppercase;display:block;margin-bottom:6px}.field{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#140e0a80;color:var(--ink);font:400 13px DM Sans,sans-serif;outline:none}.field:focus-visible{border-color:#e6bd938c}textarea.field{resize:vertical;min-height:74px;line-height:1.5}.row{display:flex;align-items:center;gap:10px}.grow{flex:1;min-width:0}.seg{display:flex;gap:6px;padding:4px;border-radius:999px;background:#140e0a80;border:1px solid var(--line-soft);width:fit-content;margin-bottom:14px}.seg button{padding:7px 14px;border-radius:999px;font:500 12px DM Sans,sans-serif;color:var(--ink-dim);transition:background .18s ease,color .18s ease}.seg button.on{background:#c98f634d;color:var(--ink)}.swatch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.swatch{position:relative;aspect-ratio:1;border-radius:16px;overflow:hidden;border:2px solid transparent;background:#140e0a80;transition:transform .15s var(--ease-out),border-color .18s ease}.swatch:active{transform:scale(.95)}.swatch.on{border-color:var(--clay-hi)}.swatch img{position:absolute;width:220%;left:-60%;top:-8%}.swatch.spec img{width:320%;left:-108%;top:-34%}.swatch .flat{position:absolute;inset:0}.swatch .name{position:absolute;left:0;right:0;bottom:0;padding:3px 0 4px;font:500 9.5px DM Sans,sans-serif;color:var(--ink);background:#140e0a8c}.toggle{position:relative;width:40px;height:23px;flex:none;border-radius:999px;background:#fff6e82e;transition:background .2s ease}.toggle.on{background:#c98f63bf}.toggle:after{content:"";position:absolute;top:2.5px;left:2.5px;width:18px;height:18px;border-radius:50%;background:#fdf6ec;transition:transform .22s var(--ease-out)}.toggle.on:after{transform:translate(17px)}.trow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0}.trow+.trow{border-top:1px solid var(--line-soft)}.trow .t{font:400 13px DM Sans,sans-serif;color:var(--ink)}.trow .d{font:400 11px DM Sans,sans-serif;color:var(--ink-dim);margin-top:2px}.btn{padding:10px 16px;border-radius:999px;font:500 12.5px DM Sans,sans-serif;color:#fff3e6;background:linear-gradient(150deg,#cf9668,#a8663f);transition:transform .15s var(--ease-out),opacity .18s ease}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.4;cursor:default}.btn.ghost{background:#fff7ec1a;border:1px solid var(--line);color:var(--ink)}.btn.danger{background:#c85a4640;border:1px solid rgba(224,139,106,.4);color:#f0c2ae}.board-r{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;padding:8px;border-radius:16px;background:#5a785047;border:1px solid rgba(185,201,138,.25)}.cell-r{position:relative;aspect-ratio:1;border-radius:6px;background:#141e1066;display:grid;place-items:center}.cell-r.legal:after{content:"";width:26%;height:26%;border-radius:50%;background:#f0dcc459}.disc{width:78%;height:78%;border-radius:50%;animation:flip .3s var(--ease-out) both}.disc.b{background:radial-gradient(circle at 35% 30%,#4c4238,#17120d)}.disc.w{background:radial-gradient(circle at 35% 30%,#fffaf0,#cbbba2)}.board-c4{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:10px;border-radius:16px;background:#505c784d;border:1px solid rgba(140,156,196,.28)}.cell-c4{aspect-ratio:1;border-radius:50%;background:#10121a80;display:grid;place-items:center}.chip{width:84%;height:84%;border-radius:50%;animation:drop .32s var(--ease-out) both}.chip.p1{background:radial-gradient(circle at 35% 30%,#f0c069,#b07c28)}.chip.p2{background:radial-gradient(circle at 35% 30%,#e08b6a,#93412a)}.chip.winring{box-shadow:0 0 0 3px #fffaf0d9;animation:winring 1s ease-in-out infinite}.board-m3{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:9px;border-radius:16px;background:#3c2e2280;border:1px solid rgba(226,177,132,.22)}.gem{aspect-ratio:1;border-radius:10px;display:grid;place-items:center;font-size:17px;transition:transform .15s var(--ease-out);animation:m3in .22s var(--ease-out) both;border:2px solid transparent}.gem.sel{border-color:#fffaf0cc;transform:scale(1.06)}.gem.clearing{animation:m3pop .28s ease-in both}.matrix{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;opacity:.5}.matrix span{position:absolute;top:0;font:600 10px monospace;color:#9fdf9a;writing-mode:vertical-rl;text-orientation:upright;letter-spacing:2px;animation:mrain 2.6s linear infinite;text-shadow:0 0 6px rgba(120,230,110,.5)}.jobbar{height:7px;border-radius:4px;background:#fff6e826;overflow:hidden}.jobbar span{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#9fdf9a,#cdeab0);transition:width 1s linear}.toast{position:absolute;left:50%;bottom:96px;transform:translate(-50%);z-index:20;padding:9px 16px;border-radius:999px;background:#140e0ae6;border:1px solid var(--line);color:var(--ink);font:500 12px DM Sans,sans-serif;white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis;animation:fadeup .25s var(--ease-out) both}.modal-backdrop{position:absolute;inset:0;z-index:30;background:#0c090699;backdrop-filter:blur(4px);display:flex;align-items:flex-end;animation:fadein .2s ease both}.modal{width:100%;border-radius:26px 26px 0 0;background:#241c15;border-top:1px solid var(--line);padding:18px 18px 26px;animation:sheetup .32s cubic-bezier(.32,.72,0,1) both}.stat{text-align:center}.stat .v{font:500 19px Newsreader,serif;color:var(--ink)}.stat .k{font:500 10px DM Sans,sans-serif;color:var(--ink-dim);letter-spacing:.05em;text-transform:uppercase;margin-top:2px}@keyframes breathe{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-7px)}}@keyframes hugpulse{0%{transform:translate(-50%) scale(1)}22%{transform:translate(-50%) scale(1.045) translateY(-10px)}55%{transform:translate(-50%) scale(1.01) translateY(-2px)}to{transform:translate(-50%) scale(1)}}@keyframes wav{0%,to{transform:scaleY(.22)}50%{transform:scaleY(1)}}@keyframes pulse{0%{transform:scale(1);opacity:.55}70%{transform:scale(2);opacity:0}to{opacity:0}}@keyframes dots{0%,to{opacity:.22}50%{opacity:1}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes rise{0%{transform:translateY(0) scale(.5);opacity:0}18%{opacity:1}to{transform:translateY(-190px) scale(1.15);opacity:0}}@keyframes fadeup{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes sheetup{0%{transform:translateY(60px);opacity:.4}to{transform:translateY(0);opacity:1}}@keyframes panelin{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes drop{0%{transform:translateY(-260px)}to{transform:translateY(0)}}@keyframes flip{0%{transform:rotateY(90deg) scale(.7)}to{transform:rotateY(0) scale(1)}}@keyframes winring{0%,to{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}@keyframes shimmer{0%{opacity:.4}50%{opacity:.9}to{opacity:.4}}@keyframes mrain{0%{transform:translateY(-62%)}to{transform:translateY(102%)}}@keyframes m3pop{0%{transform:scale(1);opacity:.95}to{transform:scale(.15);opacity:0}}@keyframes m3in{0%{transform:scale(.45) translateY(-10px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
