*,*:before,*:after{box-sizing:border-box}html{font-size:16px}body{margin:0;min-width:320px;min-height:100vh;line-height:1.5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:none;color:inherit}.prompt-wrapper{padding:var(--space-lg) var(--space-md);max-width:640px;margin:0 auto}.location-badge{display:inline-block;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:20px;padding:.2rem .75rem;font-size:var(--fs-sm);color:var(--text-secondary);margin-bottom:var(--space-sm)}.chips-row{display:flex;gap:.4rem;margin-bottom:var(--space-sm);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:3px}.chips-row::-webkit-scrollbar{display:none}.chip{flex-shrink:0;padding:.28rem .7rem;background:transparent;color:var(--accent-primary);border:1.5px solid var(--accent-primary);border-radius:20px;font-size:.8rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,transform .1s;line-height:1.4}.chip:hover:not(:disabled){background:var(--accent-primary);color:#fff;transform:translateY(-1px)}.chip:disabled{opacity:.35;cursor:not-allowed}.prompt-form{display:flex;gap:var(--space-sm)}.prompt-input{flex:1;padding:.65rem var(--space-md);background:var(--bg-secondary);border:1.5px solid var(--border-color);border-radius:var(--radius);font-size:var(--fs-md);color:var(--text-primary);transition:border-color .2s}.prompt-input::placeholder{color:var(--text-muted)}.prompt-input:focus{outline:none;border-color:var(--accent-primary)}.prompt-input:disabled{opacity:.5;cursor:not-allowed}.prompt-button{padding:.65rem var(--space-lg);background:var(--accent-primary);color:#fff;border:none;border-radius:var(--radius);font-size:var(--fs-md);font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s}.prompt-button:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.prompt-button:disabled{opacity:.5;cursor:not-allowed}@keyframes blink-cursor{0%,49%{opacity:1}50%,to{opacity:0}}.stream-cursor{display:inline-block;color:var(--accent-primary);animation:blink-cursor .9s step-end infinite;margin-left:1px;vertical-align:baseline}.stream-active .summary-para:last-child{display:inline}.error-banner{margin-top:var(--space-md);background:#e85a4a1a;border:1px solid #e85a4a;border-radius:var(--radius);padding:var(--space-sm) var(--space-md);color:#f08070;font-size:var(--fs-sm);line-height:1.5;text-align:left}.error-req-id{opacity:.55;font-size:.78em;font-family:monospace;white-space:nowrap}.weather-response{margin-top:var(--space-lg);text-align:left}.response-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-sm);min-height:1.4rem}.response-location{font-size:var(--fs-sm);color:var(--text-muted);margin:0}.response-summary{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);padding:var(--space-md) var(--space-lg);margin-bottom:var(--space-md);box-shadow:var(--shadow-card)}.summary-para{color:var(--text-secondary);font-size:var(--fs-md);line-height:1.7;margin:0 0 .75rem}.summary-para:last-child{margin-bottom:0}.alert-box{margin-top:var(--space-md);background:var(--alert-bg);border-left:4px solid var(--alert-border);padding:var(--space-md);border-radius:var(--radius);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:var(--space-xs)}.alert-summary{font-weight:600;color:var(--text-primary)}@media (max-width: 600px){.prompt-form{flex-direction:row}.prompt-input{flex:1;min-width:0}.prompt-button{width:44px;min-width:44px;padding:0;font-size:1.1rem}}.skeleton-weather-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1rem;margin:1rem 0;box-shadow:var(--shadow-card)}.skeleton-line{height:.85rem;border-radius:999px;margin:.65rem 0;background:linear-gradient(90deg,#ffffff0f,#ffffff29,#ffffff0f);background-size:200% 100%;animation:shimmer 1.2s infinite linear}.skeleton-line--title{width:55%;height:1rem}.skeleton-line--short{width:42%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.geo-controls{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-sm);margin:var(--space-sm) 0 var(--space-md);font-size:var(--fs-sm)}.geo-status-region,.geo-actions,.manual-location-form{flex:0 1 auto}.geo-city{color:var(--text-secondary);font-weight:500}.geo-status-region{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-sm)}.geo-status{color:var(--text-muted)}.geo-status--denied,.geo-status--error{color:#e85a4a}.geo-status--requesting{color:var(--accent-secondary)}.geo-actions{display:flex;gap:var(--space-xs)}.geo-btn{background:none;border:1px solid var(--border-color);border-radius:var(--radius);color:var(--text-muted);cursor:pointer;font-size:var(--fs-sm);padding:.25rem .65rem;transition:border-color .15s,color .15s}.geo-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.geo-btn--retry{border-color:#e85a4a;color:#e85a4a}.geo-btn--retry:hover{background:#e85a4a1a}.geo-btn--off,.geo-btn--manual{border-color:var(--accent-primary);color:var(--accent-primary)}.manual-location-form{width:min(100%,30rem);display:flex;flex-direction:column;align-items:center;gap:.35rem;margin-top:.15rem}.manual-location-row{width:100%;display:flex;justify-content:center;gap:var(--space-xs)}.manual-location-input{flex:1 1 14rem;min-width:0;max-width:22rem;padding:.42rem .7rem;height:44px;min-height:44px;line-height:1.2;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);color:var(--text-primary);font-size:var(--fs-sm)}.manual-location-input::placeholder{color:var(--text-muted)}.manual-location-input:focus{outline:none;border-color:var(--accent-primary)}.manual-location-submit{padding:.42rem .8rem;height:44px;min-height:44px;background:var(--accent-primary);color:#fff;border:none;border-radius:var(--radius);cursor:pointer;font-size:var(--fs-sm);font-weight:700;white-space:nowrap}.manual-location-submit:disabled,.manual-location-input:disabled{opacity:.5;cursor:not-allowed}.manual-location-hint{color:var(--text-muted);font-size:.78rem;line-height:1.35;max-width:30rem}.manual-location-examples{color:var(--text-muted);font-size:.72rem;line-height:1.3;opacity:.85}.manual-location-error{color:#f08070;font-size:.78rem;line-height:1.4}@media (max-width: 600px){.manual-location-form{width:100%;gap:.3rem}.manual-location-row{width:100%;flex-direction:row;gap:.4rem}.manual-location-input{flex:1 1 auto;width:auto;min-width:0;height:40px;min-height:40px;padding:.35rem .6rem}.manual-location-submit{flex:0 0 auto;width:auto;min-width:88px;height:40px;min-height:40px;padding:.35rem .65rem}.manual-location-hint,.manual-location-examples,.manual-location-error{font-size:.72rem}}@media (max-width: 360px){.manual-location-row{flex-direction:column}.manual-location-input,.manual-location-submit{width:100%}}.conv-root{margin:var(--space-md) 0;border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-secondary)}.conv-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem var(--space-md);background:var(--bg-card);border-bottom:1px solid var(--border-color)}.conv-title{font-size:var(--fs-sm);font-weight:600;color:var(--text-secondary);letter-spacing:.01em}.conv-clear-btn{background:none;border:1px solid transparent;color:var(--text-muted);font-size:.78rem;cursor:pointer;padding:.2rem .55rem;border-radius:var(--radius);transition:color .15s,border-color .15s,background .15s;line-height:1.4}.conv-clear-btn:hover{color:var(--text-primary);border-color:var(--border-color);background:var(--bg-surface)}.conv-scroll{max-height:380px;overflow-y:auto;padding:var(--space-md) var(--space-md) var(--space-sm);display:flex;flex-direction:column;gap:.55rem;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.conv-scroll::-webkit-scrollbar{width:4px}.conv-scroll::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}.conv-row{display:flex}.conv-row--user{justify-content:flex-end}.conv-row--assistant{justify-content:flex-start}.conv-bubble{max-width:78%;display:flex;flex-direction:column;gap:.3rem;padding:.5rem .75rem;border-radius:var(--radius);word-break:break-word}.conv-bubble--user{background:var(--accent-primary);border-bottom-right-radius:3px}.conv-bubble--assistant{background:var(--bg-card);border:1px solid var(--border-color);border-bottom-left-radius:3px}.conv-source-label{color:var(--accent-secondary);font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.conv-content{display:flex;flex-direction:column;gap:.3rem}.conv-content .stream-cursor{align-self:flex-start}.conv-para{margin:0;font-size:var(--fs-sm);line-height:1.6}.conv-bubble--user .conv-para{color:#fff}.conv-bubble--assistant .conv-para{color:var(--text-secondary)}.conv-ts{font-size:.68rem;line-height:1;align-self:flex-end}.conv-bubble--user .conv-ts{color:#fff9}.conv-bubble--assistant .conv-ts{color:var(--text-muted)}@media (max-width: 600px){.conv-bubble{max-width:85%}.conv-scroll{max-height:300px}}.hourly-wrap{position:relative;margin:var(--space-md) 0}.hourly-scroll{display:flex;gap:var(--space-sm);overflow-x:auto;padding:var(--space-sm) var(--space-xs);scrollbar-width:thin;scrollbar-color:var(--border-color) transparent;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}.hourly-scroll::-webkit-scrollbar{height:4px}.hourly-scroll::-webkit-scrollbar-track{background:transparent}.hourly-scroll::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}.hourly-fade{position:absolute;top:0;right:0;bottom:0;width:3rem;background:linear-gradient(to right,transparent,var(--bg-primary));pointer-events:none}.hourly-card{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:var(--space-sm) var(--space-md);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);min-width:4.5rem;scroll-snap-align:start;transition:border-color .25s ease}.hourly-card--current{border-color:var(--accent-primary);box-shadow:0 0 0 1px var(--accent-primary);background:var(--bg-surface)}.hourly-label{font-size:var(--fs-sm);color:var(--text-muted);font-weight:600;white-space:nowrap}.hourly-card--current .hourly-label{color:var(--accent-primary)}.hourly-emoji{font-size:1.4rem;line-height:1}.hourly-temp{font-size:var(--fs-sm);color:var(--text-primary);font-weight:500}.hourly-precip{font-size:.72rem;color:var(--accent-secondary);white-space:nowrap}.fav-row{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin:0 0 var(--space-md)}.fav-pill{display:inline-flex;align-items:center;background:var(--bg-secondary);border:1.5px solid var(--border-color);border-radius:20px;overflow:hidden;opacity:0;transform:scale(.9);transition:opacity .2s ease,transform .2s ease}.fav-pill--visible{opacity:1;transform:scale(1)}.fav-pill-name{background:none;border:none;color:var(--text-secondary);font-size:var(--fs-sm);font-weight:500;padding:.25rem .5rem .25rem .65rem;cursor:pointer;white-space:nowrap;transition:color .15s;line-height:1.4}.fav-pill-name:hover{color:var(--accent-primary)}.fav-pill-remove{background:none;border:none;border-left:1px solid var(--border-color);color:var(--text-muted);font-size:.65rem;padding:.25rem .5rem;cursor:pointer;line-height:1.4;transition:color .15s,background .15s}.fav-pill-remove:hover{color:#e85a4a;background:#e85a4a14}.fav-add-btn{background:none;border:1.5px dashed var(--border-color);border-radius:20px;color:var(--text-muted);font-size:var(--fs-sm);padding:.25rem .75rem;cursor:pointer;white-space:nowrap;transition:border-color .15s,color .15s;line-height:1.4}.fav-add-btn:hover{border-color:var(--accent-primary);color:var(--accent-primary)}.weather-indicators{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:var(--space-sm);margin:var(--space-md) 0}.indicator-tile{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);padding:var(--space-sm) var(--space-sm);display:flex;flex-direction:column;align-items:center;gap:.2rem;box-shadow:var(--shadow-card);min-width:0;overflow:hidden}.indicator-icon{font-size:1.4rem;line-height:1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.indicator-value{font-size:var(--fs-lg);font-weight:600;color:var(--text-primary);text-align:center;max-width:100%;overflow-wrap:anywhere}.indicator-label{font-size:var(--fs-sm);color:var(--text-muted);text-align:center;text-transform:uppercase;letter-spacing:.04em;max-width:100%;overflow-wrap:anywhere}.ob-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#0a0c12bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:1rem;animation:ob-fade-in .25s ease forwards}@keyframes ob-fade-in{0%{opacity:0}to{opacity:1}}.ob-modal{position:relative;width:min(520px,100%);background:var(--bg-card, #2d3540);border:1px solid var(--border-color, #3a4553);border-radius:20px;box-shadow:0 24px 64px #0009;overflow:hidden;animation:ob-slide-up .3s cubic-bezier(.34,1.2,.64,1) forwards;display:flex;flex-direction:column}@keyframes ob-slide-up{0%{transform:translateY(32px);opacity:0}to{transform:translateY(0);opacity:1}}.ob-dots{display:flex;justify-content:center;gap:.45rem;padding:1rem 1rem 0}.ob-dot{width:7px;height:7px;border-radius:50%;background:var(--border-color, #3a4553);border:none;cursor:pointer;padding:0;transition:background .2s,transform .2s}.ob-dot--active{background:var(--accent-primary, #e8834a);transform:scale(1.3)}.ob-skip{position:absolute;top:.85rem;right:1rem;background:none;border:none;color:var(--text-muted, #6b7a8d);font-size:.82rem;cursor:pointer;padding:.2rem .4rem;transition:color .15s;line-height:1}.ob-skip:hover{color:var(--text-secondary, #a8b3be)}.ob-panels{display:flex;width:100%;transition:transform .35s cubic-bezier(.4,0,.2,1);min-height:0}.ob-panel{flex:0 0 100%;width:100%;padding:1.5rem 2rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.75rem;box-sizing:border-box}.ob-panel--guides{padding:1.25rem 1rem}.ob-logo{max-width:260px;width:100%;margin-bottom:.25rem}.ob-heading{margin:0;font-size:1.45rem;font-weight:800;color:var(--text-primary, #f0f2f5);line-height:1.2}.ob-body{margin:0;font-size:.97rem;color:var(--text-secondary, #a8b3be);line-height:1.6;max-width:380px}.ob-body--muted{color:var(--text-muted, #6b7a8d);font-size:.88rem}.ob-location-icon{font-size:3rem;line-height:1}.ob-guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;width:100%;max-height:340px;overflow-y:auto;padding:.25rem;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}.ob-guide-card{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.4rem .25rem;border:1.5px solid rgba(159,179,200,.2);border-radius:10px;background:#1f293799;color:var(--text-primary, #f0f2f5);cursor:pointer;transition:border-color .15s,transform .12s,box-shadow .15s;text-align:center}.ob-guide-card:hover{transform:translateY(-2px);border-color:#f9731699}.ob-guide-card--selected{border-color:var(--accent-primary, #e8834a);box-shadow:0 0 0 2px #e8834a59;background:#2c3748f2}.ob-guide-img{width:100%;aspect-ratio:1 / 1;object-fit:cover;border-radius:7px;border:1px solid rgba(255,255,255,.1)}.ob-guide-name{font-size:.7rem;font-weight:700;line-height:1.2;color:var(--text-secondary, #a8b3be)}.ob-nav{display:flex;justify-content:flex-end;align-items:center;gap:.6rem;padding:1rem 1.5rem 1.25rem;border-top:1px solid var(--border-color, #3a4553)}.ob-btn{padding:.55rem 1.4rem;border-radius:var(--radius, 10px);font-size:.95rem;font-weight:700;cursor:pointer;transition:opacity .15s,transform .1s;border:none;line-height:1}.ob-btn:hover{opacity:.88;transform:translateY(-1px)}.ob-btn--primary{background:var(--accent-primary, #e8834a);color:#fff;margin-left:auto}.ob-btn--ghost{background:transparent;border:1px solid var(--border-color, #3a4553);color:var(--text-secondary, #a8b3be)}.ob-btn--ghost:hover{border-color:var(--accent-primary, #e8834a);color:var(--text-primary, #f0f2f5)}@media (max-width: 600px){.ob-backdrop{padding:0;align-items:flex-end}.ob-modal{width:100%;border-radius:20px 20px 0 0;max-height:92dvh;overflow-y:auto}.ob-panel{padding:1.25rem}.ob-guide-grid{grid-template-columns:repeat(2,1fr);max-height:none}.ob-logo{max-width:180px}.ob-heading{font-size:1.25rem}}.unit-toggle{display:inline-flex;align-items:center;justify-content:center;gap:0;max-width:100%;margin:.35rem auto .75rem;border:1px solid var(--border-color);border-radius:999px;overflow:hidden;background:var(--bg-secondary)}.unit-toggle button{border:0;padding:.35rem .75rem;background:transparent;color:var(--text-muted);font-weight:700;line-height:1;cursor:pointer}.unit-toggle button.active{background:var(--accent-primary);color:#fff}.unit-toggle button:focus-visible{outline:2px solid var(--accent-secondary);outline-offset:-2px}.vitd-card{margin-top:var(--space-lg);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);padding:var(--space-md) var(--space-lg);box-shadow:var(--shadow-card);text-align:left}.vitd-header{display:flex;align-items:baseline;gap:var(--space-sm);margin-bottom:var(--space-md);flex-wrap:wrap}.vitd-title{font-size:var(--fs-md);font-weight:700;color:var(--text-primary)}.vitd-subtitle{font-size:var(--fs-sm);color:var(--text-muted)}.vitd-picker-row{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;margin-bottom:var(--space-sm)}.vitd-picker-label{font-size:var(--fs-sm);color:var(--text-muted);white-space:nowrap}.vitd-swatches{display:flex;gap:5px}.vitd-swatch{width:34px;height:34px;border-radius:50%;border:2.5px solid transparent;cursor:pointer;font-size:.62rem;font-weight:700;display:flex;align-items:center;justify-content:center;transition:transform .15s,border-color .15s,box-shadow .15s;line-height:1}.vitd-swatch:hover{transform:scale(1.12)}.vitd-swatch--active{border-color:var(--accent-primary);transform:scale(1.18);box-shadow:0 0 0 2px var(--bg-card),0 0 0 4px var(--accent-primary)}.vitd-skin-name{font-size:var(--fs-sm);color:var(--text-secondary)}.vitd-btn{margin-top:var(--space-sm);width:100%;padding:.6rem var(--space-md);background:#d4941f;color:#fff;border:none;border-radius:var(--radius);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;letter-spacing:.01em}.vitd-btn:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}.vitd-btn:disabled{opacity:.38;cursor:not-allowed}.vitd-notice,.vitd-error{margin-top:var(--space-sm);font-size:var(--fs-sm);color:var(--text-muted);line-height:1.5}.vitd-error{color:#f08070}.vitd-result{margin-top:var(--space-md);border-top:1px solid var(--border-color);padding-top:var(--space-md)}.vitd-index-row{display:flex;align-items:baseline;gap:.35rem;margin-bottom:var(--space-sm)}.vitd-index-value{font-size:2.4rem;font-weight:800;line-height:1;transition:color .3s}.vitd-index-denom{font-size:var(--fs-md);font-weight:400;color:var(--text-muted)}.vitd-index-label{font-size:var(--fs-sm);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;align-self:center}.vitd-recommendation{font-size:var(--fs-sm);color:var(--text-secondary);line-height:1.65;margin:0 0 var(--space-md)}.vitd-context-row{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:var(--space-md)}.vitd-context-row span{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:999px;color:var(--text-secondary);font-size:.78rem;padding:.2rem .55rem}.vitd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-sm);margin-bottom:var(--space-sm)}.vitd-stat{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);padding:var(--space-sm) .4rem;display:flex;flex-direction:column;align-items:center;gap:3px}.vitd-stat-icon{font-size:1.15rem;line-height:1}.vitd-stat-value{font-size:var(--fs-sm);font-weight:600;color:var(--text-primary);text-align:center}.vitd-stat-label{font-size:.7rem;color:var(--text-muted);text-align:center;text-transform:uppercase;letter-spacing:.03em;line-height:1.2}.vitd-skin-used{font-size:var(--fs-sm);color:var(--text-muted);margin:0 0 var(--space-xs)}.vitd-safety-note{color:var(--text-muted);font-size:var(--fs-sm);line-height:1.55;margin:0}@media (max-width: 600px){.vitd-stats{grid-template-columns:repeat(2,1fr)}.vitd-picker-row{flex-direction:column;align-items:flex-start}}html,body,#root{width:100%;max-width:100%}html{overflow-x:hidden}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0;overflow-x:clip}#root{max-width:1280px;margin:0 auto;padding:1rem;text-align:center;box-sizing:border-box;padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}.app-error-fallback{max-width:40rem;margin:2rem auto;padding:1rem;color:var(--text-primary);background:var(--bg-card);border:1px solid var(--accent-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.page-wrapper,.main-content,.app-container{width:100%;max-width:100%;min-width:0;box-sizing:border-box}.guide-selector-section,.prompt-wrapper,.weather-indicators,.hourly-wrap,.conv-root,.fav-row,.geo-controls,.manual-location-form,.mobile-support-row{max-width:100%;min-width:0;box-sizing:border-box}.hourly-wrap,.hourly-scroll,.chips-row{max-width:100%;min-width:0}.page-wrapper{display:flex;justify-content:center;align-items:flex-start;padding:1rem;gap:1rem}.sidebar{width:160px;min-height:100vh;position:sticky;top:0;display:none}@media screen and (min-width: 1024px){.sidebar{display:block}}.main-content{flex-grow:1;max-width:800px}.logo{max-width:540px;width:78%;margin:0 auto 1.5rem;display:block;border:2px solid var(--accent-primary);padding:10px;background-color:#000;box-shadow:0 0 18px #e8834a80;image-rendering:pixelated;animation:crt-glow 2.5s ease-in-out infinite;will-change:transform,filter}@keyframes crt-glow{0%{filter:brightness(1)}50%{filter:brightness(1.15)}to{filter:brightness(1)}}.logo.loading{animation:donkey-load .8s ease-in-out infinite}@keyframes donkey-load{0%,to{transform:scale(1) translateY(0);filter:brightness(1) drop-shadow(0 0 4px rgba(199,108,17,.15))}50%{transform:scale(1.02) translateY(-3px);filter:brightness(1.1) drop-shadow(0 0 8px rgba(199,108,17,.4))}}.donkey-mood{display:block;margin:.5rem auto 1rem;max-width:220px;width:100%;height:auto;object-fit:contain;opacity:.96}.mood-debug-panel{width:min(100%,34rem);margin:0 auto var(--space-md);padding:.65rem .8rem;background:#0a0e14e0;border:1px solid var(--border-color);border-radius:var(--radius);color:var(--text-secondary);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.72rem;line-height:1.45;text-align:left}.mood-debug-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:.45rem;margin-top:.6rem}.mood-debug-preview{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.35rem;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius);text-align:center}.mood-debug-preview img{width:42px;height:42px;object-fit:contain}.mood-debug-preview span{max-width:100%;overflow-wrap:anywhere}.title{font-size:2.25rem;font-weight:700;color:var(--text-primary);margin-bottom:.5rem}.subtitle{font-size:var(--fs-lg);margin-top:var(--space-sm);margin-bottom:var(--space-md);color:var(--text-secondary)}.auto-weather-loading{color:var(--text-muted);font-size:var(--fs-sm);margin:var(--space-sm) 0;text-align:center}.auto-weather-card{position:relative;background:var(--bg-card);border:1px solid var(--accent-secondary);border-radius:var(--radius-lg);padding:var(--space-md) var(--space-lg);margin:var(--space-md) 0;text-align:left;box-shadow:var(--shadow-card)}.auto-weather-actions{position:absolute;top:.5rem;right:.65rem;display:flex;align-items:center;gap:.35rem}.auto-weather-dismiss{background:none;border:none;color:var(--text-muted);font-size:1.3rem;line-height:1;cursor:pointer;padding:0}.auto-weather-dismiss:hover{color:var(--text-primary)}.auto-weather-title{margin:0 0 .6rem;color:var(--text-primary);font-size:var(--fs-lg)}.auto-weather-content{font-size:var(--fs-md);line-height:1.65;color:var(--text-secondary)}.auto-weather-content p{margin:0 0 .6rem}.auto-weather-content p:last-child{margin-bottom:0}.support-card{background:var(--bg-card);border:1px solid var(--accent-primary);border-radius:var(--radius);padding:var(--space-md);text-align:center;box-shadow:var(--shadow-card)}.support-card--thumbnail{display:flex;flex-direction:column;align-items:center;gap:.45rem;width:100%;box-sizing:border-box;color:var(--text-primary);text-decoration:none;transition:transform .16s,border-color .16s,box-shadow .16s}.support-card--thumbnail:hover{transform:translateY(-2px);border-color:var(--accent-secondary);box-shadow:0 6px 18px #e8834a38}.support-card-img{display:block;width:100%;max-width:128px;aspect-ratio:1 / 1;object-fit:contain;border-radius:calc(var(--radius) - 2px)}.support-card-title,.support-card-heading{font-weight:700;color:var(--text-primary);margin:0 0 var(--space-xs);font-size:var(--fs-md)}.support-card-subtitle,.support-card-body{color:var(--text-muted);font-size:var(--fs-sm);margin:0;line-height:1.35}.kofi-btn{display:inline-block;background:var(--accent-primary);color:#fff;padding:.45rem 1rem;border-radius:var(--radius);text-decoration:none;font-weight:600;font-size:var(--fs-sm);transition:opacity .15s}.kofi-btn:hover{opacity:.88}.guide-selector-section{width:min(100%,980px);margin:1.25rem auto;padding:0 1rem}.guide-selector-title{margin:0 0 .75rem;font-size:.95rem;letter-spacing:.16em;text-transform:uppercase;color:#9fb3c8}.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:.75rem;align-items:stretch}.guide-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.55rem;border:1px solid rgba(159,179,200,.25);border-radius:10px;background:#1f2937b8;color:#f8fafc;cursor:pointer;text-align:center;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}.guide-card:hover{transform:translateY(-2px);border-color:#f97316bf;box-shadow:0 0 0 1px #f9731633}.guide-card.selected{border-color:#f97316;box-shadow:0 0 0 2px #f9731661;background:#2c3748f2}.guide-badge{position:absolute;top:.35rem;left:.35rem;padding:.12rem .35rem;border-radius:999px;background:#f97316;color:#fff7ed;font-size:.62rem;font-weight:800;letter-spacing:.06em}.guide-image{width:100%;max-width:112px;aspect-ratio:1 / 1;object-fit:cover;border-radius:8px;border:1px solid rgba(255,255,255,.12)}.guide-title{font-weight:800;font-size:.95rem;line-height:1.1}.guide-description{color:#a8b3c2;font-size:.78rem;line-height:1.25}@media (max-width: 768px){.guide-selector-section{margin:1rem auto}.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-image{max-width:96px}.guide-description{font-size:.72rem}}@media (max-width: 480px){.guide-grid{grid-template-columns:1fr}.guide-card{width:100%}.guide-image{max-width:88px}.guide-description{overflow-wrap:anywhere}}.footer{margin-top:var(--space-xl);font-size:var(--fs-sm);color:var(--text-muted);text-align:center}.app-version{display:block;margin-top:.35rem;font-size:.72rem;color:color-mix(in srgb,var(--text-muted) 72%,transparent)}.app-container{text-align:center;padding-top:1.5rem}.offline-banner{width:min(100%,42rem);margin:0 auto 1rem;padding:.75rem 1rem;color:#fff7ed;background:#7c2d12;border:1px solid #fb923c;border-radius:var(--radius);font-weight:700;line-height:1.4;box-shadow:var(--shadow-card)}@media (max-width: 768px){body,#root{overflow-x:hidden}#root{padding:0}.page-wrapper{padding:.5rem;gap:0;max-width:100vw;overflow-x:clip}.main-content{max-width:100%;min-width:0}.app-container{max-width:100%;min-width:0;padding-top:.75rem}.donkey-mood{max-width:150px}.logo{max-width:430px;width:88%}.title{font-size:1.6rem}.subtitle{font-size:var(--fs-md)}}.mobile-support-row{display:flex;gap:.75rem;margin:1rem auto;max-width:520px}@media screen and (min-width: 1024px){.mobile-support-row{display:none}}@media (max-width: 560px){.mobile-support-row{flex-direction:column;align-items:stretch}.mobile-support-row .support-card-img{max-width:96px}}@property --accent-primary{syntax: "<color>"; inherits: true; initial-value: #e8834a;}@property --bg-secondary{syntax: "<color>"; inherits: true; initial-value: #252b33;}:root{transition:--accent-primary 1s ease,--bg-secondary 1s ease,color 1s ease,background-color 1s ease;--bg-primary: #1a1e24;--bg-secondary: #252b33;--bg-card: #2d3540;--bg-surface: #333c47;--accent-primary: #e8834a;--accent-secondary: #4a90e2;--accent-donkey: #e8834a;--text-primary: #f0f2f5;--text-secondary: #a8b3be;--text-muted: #6b7a8d;--border-color: #3a4553;--fs-xxl: 2.5rem;--fs-xl: 1.75rem;--fs-lg: 1.125rem;--fs-md: 1rem;--fs-sm: .875rem;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--radius: 10px;--radius-lg: 16px;--shadow-sm: 0 1px 4px rgba(0, 0, 0, .3);--shadow-md: 0 2px 10px rgba(0, 0, 0, .4);--shadow-card: 0 2px 12px rgba(0, 0, 0, .4);--card-bg: #2d3540;--alert-bg: rgba(232, 131, 74, .1);--alert-border: var(--accent-primary)}