:root{font-family:Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,sans-serif;color:#fff7dc;background:#102b22;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--cream: #fff1c9;--cream-strong: #ffe5a3;--gold: #ffc43a;--gold-deep: #d68a16;--green: #315d35;--green-deep: #123425;--teal: #5bd6c5;--ink: #3b2a12;--shadow: rgba(13, 34, 21, .42)}*{box-sizing:border-box}html{min-width:320px;background:#102b22;scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}#root{overflow-x:hidden}button,textarea,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.dream-lab-app{min-height:100vh;position:relative;overflow:hidden;background:radial-gradient(circle at 76% 16%,rgba(255,166,74,.38),transparent 16rem),radial-gradient(circle at 22% 32%,rgba(91,214,197,.24),transparent 18rem),linear-gradient(180deg,#081d1826,#081d18bf),url(../assets/talkidino/backgrounds/bg_main.png) center / cover fixed}.dream-lab-app:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(8,27,21,.5),transparent 20%,transparent 80%,rgba(8,27,21,.5)),radial-gradient(circle at 50% 55%,transparent 0,transparent 33rem,rgba(6,22,18,.36) 52rem);z-index:0}.dream-lab-app:after{content:"";position:fixed;right:-7vw;top:8vh;width:min(34vw,460px);height:min(50vh,520px);pointer-events:none;background:url(../assets/talkidino/backgrounds/bg_scene_volcano.png) center / cover;border-radius:48% 52% 42% 58%;filter:saturate(1.1) blur(.1px);opacity:.58;-webkit-mask-image:radial-gradient(circle,#000 0 46%,transparent 72%);mask-image:radial-gradient(circle,#000 0 46%,transparent 72%);z-index:0}.site-header,main,.site-footer,.toast{position:relative;z-index:1}.site-header{width:min(1500px,calc(100vw - 32px));height:78px;margin:0 auto;padding:12px 0;display:grid;grid-template-columns:250px 1fr 245px;align-items:center;gap:16px}.brand-lockup{display:inline-flex;align-items:center;gap:10px;width:fit-content;font-size:34px;font-weight:1000;letter-spacing:0;color:#ffd852;text-shadow:0 3px 0 #704114,0 8px 18px rgba(0,0,0,.3)}.brand-lockup img{width:50px;height:50px;border-radius:16px;box-shadow:0 8px 20px #00000040}.main-nav{justify-self:center;display:inline-flex;align-items:center;gap:4px;padding:8px;border-radius:0 0 32px 32px;background:#3138179e;border:1px solid rgba(255,230,150,.3);box-shadow:0 12px 32px #0003,inset 0 1px #ffffff24;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.main-nav a{padding:12px 18px;border-radius:999px;font-weight:900;font-size:15px;color:#fff6d4}.main-nav a.active,.main-nav a:hover{color:#3a2a0d;background:linear-gradient(180deg,#ffe987,#f5bd3e);box-shadow:inset 0 1px #ffffff8c,0 8px 16px #ffc43a38}.chrome-actions{justify-self:end;display:inline-flex;gap:8px}.chrome-actions button{border:1px solid rgba(255,230,150,.28);border-radius:999px;padding:10px 12px;color:#fff1bd;font-weight:900;background:#4533169e;box-shadow:inset 0 1px #ffffff29,0 8px 18px #00000038;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.hero-section{min-height:calc(100vh - 78px);width:min(1540px,calc(100vw - 28px));margin:0 auto;padding:8px 0 20px;display:grid;grid-template-rows:auto 1fr auto;gap:12px}.hero-copy{text-align:center;padding:0 16px}.hero-copy h1{margin:0;color:#fff8e5;font-size:clamp(32px,4.25vw,62px);line-height:1.05;font-weight:1000;letter-spacing:0;text-shadow:0 5px 0 rgba(39,35,17,.6),0 14px 34px rgba(0,0,0,.35)}.hero-copy h1 span{display:block;color:#ffd94f}.hero-copy p{margin:12px auto 0;width:min(760px,94vw);color:#fff3cc;font-size:clamp(16px,1.7vw,24px);font-weight:900;line-height:1.45;text-shadow:0 4px 14px rgba(0,0,0,.42)}.hero-grid{min-height:560px;display:grid;grid-template-columns:minmax(154px,.35fr) minmax(680px,1.55fr) minmax(154px,.35fr);align-items:center;gap:clamp(14px,1.8vw,28px);min-width:0}.universe-rail{display:grid;gap:14px;align-content:center;justify-items:center}.portal-card{width:min(100%,206px);min-height:86px;display:grid;grid-template-columns:68px 1fr;align-items:center;gap:9px;padding:8px 10px 8px 6px;border-radius:28px 18px 18px 28px;background:#62481e94;border:1px solid rgba(255,223,135,.38);box-shadow:0 12px 28px #00000042,inset 0 1px #ffffff2e;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .18s ease,filter .18s ease}.right .portal-card{grid-template-columns:68px 1fr;border-radius:18px 28px 28px 18px}.portal-card:hover{transform:translateY(-4px) scale(1.02);filter:brightness(1.08)}.portal-island{width:66px;height:66px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 50% 35%,rgba(255,244,174,.65),transparent 38%),linear-gradient(180deg,#7bd15a,#3c8c45);box-shadow:inset 0 -9px #4c371438,0 10px 20px #0000003d}.portal-island img{width:58px;height:58px;object-fit:contain}.portal-copy h3{margin:0;color:#ffe184;font-size:17px;line-height:1.1;font-weight:1000;text-shadow:0 2px 0 rgba(76,39,11,.75)}.portal-copy p{margin:4px 0 0;color:#fff7dce6;font-size:11px;line-height:1.35;font-weight:800}.portal-title-row{display:grid;gap:3px}.status-dot{width:fit-content;border-radius:999px;padding:2px 7px;color:#3e2b08;background:#ffe591;font-size:9px;font-weight:1000}.status-dot.soon{color:#fff4cf;background:#1c2012b3;border:1px solid rgba(255,231,162,.38)}.dream-tablet-shell{align-self:stretch;display:grid;place-items:center;width:100%;min-width:0}.tablet-frame{position:relative;width:min(100%,920px);min-height:560px;border-radius:52px;padding:24px;background:linear-gradient(180deg,#fff6d0f5,#eabf6ff5),var(--cream);box-shadow:0 30px 70px #0006,inset 0 2px #fffc,inset 0 -10px #84561833}.tablet-frame:before{content:"";position:absolute;inset:8px;border-radius:44px;border:2px solid rgba(111,83,28,.28);pointer-events:none}.tablet-frame:after{content:"";position:absolute;left:50%;top:8px;width:86px;height:38px;transform:translate(-50%);border-radius:0 0 34px 34px;background:linear-gradient(180deg,#f8d37b,#ad752e);box-shadow:inset 0 2px #ffffff6b}.tablet-screen{position:relative;width:100%;min-width:0;min-height:512px;overflow:hidden;border-radius:34px;background:linear-gradient(180deg,#103a261f,#091b176b),radial-gradient(circle at 48% 28%,rgba(255,225,112,.16),transparent 26rem),url(../assets/talkidino/backgrounds/bg_main.png) center / cover;border:4px solid rgba(83,63,21,.35);box-shadow:inset 0 18px 42px #0000003d,inset 0 -12px 34px #14402747}.idle-layout{min-height:512px;display:grid;grid-template-columns:minmax(210px,.78fr) minmax(360px,1fr);align-items:center;gap:clamp(18px,3vw,36px);padding:clamp(24px,4vw,44px);min-width:0}.dino-guide{align-self:end;position:relative;display:grid;justify-items:center;gap:12px}.guide-glow{position:absolute;width:230px;height:230px;top:24px;border-radius:50%;background:radial-gradient(circle,rgba(255,223,96,.55),transparent 68%);filter:blur(8px)}.dino-guide img{position:relative;z-index:1;width:min(260px,78%);filter:drop-shadow(0 22px 24px rgba(0,0,0,.24))}.dino-guide p{position:relative;z-index:1;width:min(240px,100%);margin:0;padding:10px 14px;border-radius:18px;color:#fff5cb;background:#1f432594;border:1px solid rgba(255,230,150,.28);font-size:14px;line-height:1.45;font-weight:900;text-align:center;box-shadow:0 14px 24px #0000002e}.composer-shell{position:relative;width:100%;min-width:0;max-width:100%;padding:clamp(18px,2.3vw,26px);border-radius:28px;color:#3c2c13;background:#fff2cbeb;border:3px solid rgba(255,217,105,.8);box-shadow:0 18px 38px #0003,inset 0 1px #ffffffad}.composer-shell h2{margin:0 0 14px;color:#5b3c0d;font-size:clamp(25px,2.7vw,36px);line-height:1.12;font-weight:1000;letter-spacing:0}.prompt-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.prompt-chips button{min-width:0;min-height:52px;padding:8px 10px;border:0;border-radius:16px;color:#573813;background:linear-gradient(180deg,#fff3c6,#f8d776);box-shadow:inset 0 1px #fffc,0 8px 15px #5d3f1029;font-size:12px;font-weight:1000;line-height:1.3}.prompt-box{display:grid;gap:6px;padding:12px 14px 8px;border-radius:18px;background:#fff9e3eb;border:2px solid rgba(194,135,36,.34);box-shadow:inset 0 4px 10px #472f1112}.prompt-box span{color:#765323;font-size:12px;font-weight:1000}.prompt-box textarea{width:100%;min-width:0;min-height:82px;resize:vertical;border:0;outline:0;color:#3a2a14;background:transparent;font-size:16px;line-height:1.5;font-weight:800}.prompt-box small{justify-self:end;color:#9c7442;font-weight:900}.composer-actions{display:grid;grid-template-columns:.8fr 1.2fr;gap:12px;margin:14px 0 10px}.mic-button,.create-button,.game-actions button,.error-state button{border:0;border-radius:999px;font-weight:1000}.mic-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 14px;color:#f7ffdf;background:linear-gradient(180deg,#75c85b,#34733b);box-shadow:0 8px #1d4d2c,0 14px 22px #193f1b33}.mic-button.listening,body[data-listening=true] .mic-button{background:linear-gradient(180deg,#7de8d8,#1b8f7b)}.mic-button img{width:28px;height:28px;object-fit:contain}.create-button{min-height:58px;padding:12px 22px;color:#4a3108;background:linear-gradient(180deg,#ffe889,#ffb42f);box-shadow:0 9px #b56f16,0 18px 26px #62400c38;font-size:22px}.create-button:disabled{cursor:not-allowed;filter:grayscale(.3);opacity:.72}.speech-note{min-height:22px;margin:0 0 12px;color:#6b4a1c;font-size:13px;font-weight:900}.tier-switcher{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tier-switcher button{display:grid;gap:2px;min-width:0;min-height:68px;padding:8px;border:2px solid rgba(127,94,39,.18);border-radius:18px;color:#553914;background:#fff9e1b8;box-shadow:inset 0 1px #ffffffa6;font-weight:1000}.tier-switcher button.selected{border-color:#ffbd34;background:linear-gradient(180deg,#fff2b0,#ffd45f);box-shadow:0 10px 20px #a468132e}.tier-switcher span{font-size:12px}.tier-switcher strong{font-size:15px}.tier-switcher small{font-size:11px;color:#806236}.loading-state,.error-state{margin-top:14px;display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;background:#ffffff80;color:#4c3411;font-weight:900}.loading-state p{margin:3px 0 0;color:#72542a;font-size:13px}.sparkle-loader{width:54px;height:54px;display:grid;place-items:center;border-radius:50%;background:#fff0ad;overflow:hidden}.sparkle-loader img{width:76px;height:76px;animation:spin 4s linear infinite}.error-state{align-items:center;justify-content:space-between}.error-state div{display:grid;gap:4px}.error-state small{color:#765323;font-size:12px}.error-state button{padding:10px 14px;color:#fff6da;background:#2f6a3e}.game-state{min-height:512px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px;background:linear-gradient(180deg,#09231c2e,#09231cb8),url(../assets/talkidino/backgrounds/bg_scene_shore.png) center / cover}.game-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;border-radius:22px;color:#fff4d1;background:#1d3d22b8;border:1px solid rgba(255,232,158,.24);box-shadow:inset 0 1px #ffffff1f}.game-topbar div{display:grid;gap:2px}.game-topbar span,.game-topbar small{font-size:12px;font-weight:900;opacity:.84}.game-topbar strong{font-size:18px;font-weight:1000}.game-diagnostics{display:grid;justify-items:end;gap:2px;text-align:right}.game-state iframe{width:100%;height:100%;min-height:370px;border:0;border-radius:24px;background:#143a2b;box-shadow:0 18px 30px #00000042}.game-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.game-actions button{min-height:46px;padding:10px;color:#4a3108;background:linear-gradient(180deg,#ffe78b,#f7bd3c);box-shadow:0 6px #a56d1a}.tablet-hardware{position:absolute;left:50%;bottom:8px;transform:translate(-50%);display:flex;gap:12px}.tablet-hardware span{width:20px;height:20px;border-radius:50%;background:linear-gradient(180deg,#ffdc63,#9b5e1b);box-shadow:inset 0 2px #ffffff73,0 6px 12px #0003}.parent-band{width:min(980px,94vw);margin:0 auto;padding:16px 22px 18px;display:grid;grid-template-columns:1.1fr 1.4fr;gap:18px;align-items:center;border-radius:34px 34px 0 0;color:#563b16;background:#ffefc2f0;border:2px solid rgba(255,229,157,.8);box-shadow:0 -10px 32px #0000002e,inset 0 1px #ffffffb3}.parent-band h2{margin:0;font-size:clamp(19px,2.1vw,28px);line-height:1.18;font-weight:1000}.parent-band p{margin:8px 0 0;font-size:14px;line-height:1.55;font-weight:800}.parent-points{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.parent-points article{min-height:76px;padding:12px;border-radius:20px;background:#fffae8d1;box-shadow:inset 0 1px #ffffffbf}.parent-points strong{display:block;font-size:14px;font-weight:1000}.parent-points span{display:block;margin-top:4px;font-size:12px;line-height:1.4;font-weight:800}.site-footer{width:min(1200px,calc(100vw - 36px));margin:0 auto;padding:18px 0 28px;display:flex;justify-content:space-between;gap:18px;color:#fff5dad6;font-weight:800;font-size:13px}.site-footer nav{display:flex;gap:14px}.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%);width:min(520px,calc(100vw - 28px));display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px 12px 18px;border-radius:20px;color:#3f2c11;background:#ffeebef5;border:2px solid rgba(255,207,87,.8);box-shadow:0 18px 44px #00000047;font-weight:900}.toast button{flex:0 0 auto;border:0;border-radius:999px;padding:8px 12px;color:#fff5d7;background:#315d35;font-weight:1000}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1180px){.site-header{grid-template-columns:1fr auto;height:auto;padding-top:14px}.main-nav{grid-column:1 / -1;grid-row:2}.chrome-actions{grid-column:2}.hero-grid{grid-template-columns:1fr;min-height:0}.dream-tablet-shell{order:1}.universe-rail.left{order:2}.universe-rail.right{order:3}.universe-rail{display:flex;overflow-x:auto;justify-content:flex-start;padding:0 4px 8px;scroll-snap-type:x mandatory}.portal-card{flex:0 0 206px;scroll-snap-align:start}}@media(max-width:760px){.dream-lab-app{background-attachment:scroll}.site-header{width:min(100vw - 18px,720px);grid-template-columns:1fr;justify-items:center;gap:10px;overflow:hidden}.brand-lockup{font-size:30px}.main-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:100%;overflow:visible;border-radius:24px}.main-nav a{padding:9px 6px;font-size:11px;text-align:center;white-space:nowrap}.main-nav a[href="#download"],.chrome-actions{display:none}.hero-section{width:100%;padding-left:8px;padding-right:8px;padding-top:4px;overflow:hidden}.hero-copy h1{max-width:min(330px,calc(100vw - 34px));margin:0 auto;font-size:clamp(27px,7.4vw,36px);word-break:break-all;text-wrap:balance}.hero-copy p{width:min(340px,calc(100vw - 34px));font-size:14px;overflow-wrap:anywhere}.tablet-frame{width:min(100%,calc(100vw - 16px));max-width:calc(100vw - 16px);min-height:0;padding:13px;border-radius:34px}.dream-tablet-shell,.composer-shell{min-width:0}.tablet-screen,.idle-layout,.game-state{min-height:610px}.idle-layout{grid-template-columns:1fr;gap:10px;padding:18px}.dino-guide{align-self:center}.dino-guide img{width:min(190px,62vw)}.dino-guide p{width:min(320px,100%)}.prompt-chips,.composer-actions,.tier-switcher,.game-actions,.parent-band,.parent-points{grid-template-columns:1fr}.game-state iframe{min-height:350px}.portal-card{flex-basis:min(220px,calc(100vw - 32px))}.site-footer{flex-direction:column;align-items:center;text-align:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
