@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Bai+Jamjuree:wght@400;500;600;700&family=Kanit:wght@400;500;600;700&display=swap";:root{--primary:#c94252;--primary-hover:#b03a48;--primary-container:#fde8ea;--on-primary:#fff;--secondary:#2d3748;--background:#f8f9fa;--surface:#fff;--on-surface:#1a1a1a;--on-surface-variant:#4a5568;--outline:#e2e8f0;--outline-variant:#cbd5e0;--error:#dc2626;--surface-container:#f1f5f9}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--on-surface);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,sans-serif}.app-header{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--outline);background-color:#ffffffe6;justify-content:space-between;align-items:center;width:100%;height:4rem;padding:0 1rem;display:flex;position:fixed;top:0;left:0;box-shadow:0 1px 2px #0000000d}.brand{align-items:center;gap:1rem;display:flex}.brand h1{letter-spacing:-.02em;font-size:1.125rem;font-weight:900}.brand h1 .text-primary{color:var(--primary)}.header-actions{align-items:center;gap:1rem;display:flex}.view-badge{color:var(--on-surface-variant);font-size:.875rem;font-weight:500;display:none}@media (width>=640px){.view-badge{display:block}}.avatar{border:2px solid var(--primary-container);cursor:pointer;background-color:#e2e8f0;border-radius:999px;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex;position:relative;overflow:hidden}.main-content{min-height:100vh;padding-top:4rem;padding-bottom:5rem}.container{max-width:1200px;margin:0 auto;padding:2rem 1.5rem}.layout-grid{grid-template-columns:1fr;gap:2rem;display:grid}@media (width>=1024px){.layout-grid{grid-template-columns:3fr 9fr}}.page-header{flex-direction:column;justify-content:space-between;gap:1.5rem;margin-bottom:3rem;display:flex}@media (width>=768px){.page-header{flex-direction:row;align-items:flex-end}}.page-title{margin-bottom:.25rem;font-size:1.875rem;font-weight:900}.page-subtitle{color:var(--on-surface-variant);font-size:1rem}.view-toggle-container{background-color:var(--surface);border:1px solid var(--outline);border-radius:.75rem;padding:.25rem;display:flex;box-shadow:0 1px 2px #0000000d}.view-toggle-btn{cursor:pointer;color:var(--on-surface-variant);background:0 0;border:none;border-radius:.5rem;padding:.5rem 1.5rem;font-size:.875rem;font-weight:600;transition:all .2s}.view-toggle-btn.active{background-color:var(--primary);color:var(--on-primary);box-shadow:0 4px 6px #0000001a}.ask-form{background-color:var(--surface);border:1px solid var(--outline);border-radius:.75rem;margin-bottom:2rem;padding:1.5rem;box-shadow:0 4px 6px #0000000d}.ask-form h2{margin-bottom:1rem;font-size:1.25rem;font-weight:700}.ask-input{border:1px solid var(--outline);resize:vertical;background-color:#faf7f0;border-radius:.5rem;outline:none;width:100%;min-height:100px;margin-bottom:1rem;padding:1rem;font-family:inherit;font-size:1rem;transition:all .2s}.ask-input:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-container)}.ask-footer{justify-content:space-between;align-items:center;display:flex}.btn-submit{background-color:var(--primary);color:var(--on-primary);cursor:pointer;border:none;border-radius:999px;align-items:center;gap:.5rem;padding:.625rem 2rem;font-size:.875rem;font-weight:600;transition:background-color .2s;display:flex}.btn-submit:hover{background-color:var(--primary-hover)}.btn-submit:disabled{opacity:.5;cursor:not-allowed}.questions-list{flex-direction:column;gap:1rem;display:flex}.question-card{background-color:var(--surface);border:1px solid var(--outline);border-radius:.75rem;flex-direction:column;gap:1.5rem;padding:1.5rem;transition:border-color .2s,box-shadow .2s,background-color .2s;display:flex;box-shadow:0 1px 3px #0000000d}@media (width>=640px){.question-card{flex-direction:row;justify-content:space-between;align-items:flex-start}}.question-card:hover{border-color:#c9425233;box-shadow:0 4px 6px #0000000d}.question-card.is-done{opacity:.3}.question-content{flex:1}.question-header{align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.question-author-img{background-color:var(--surface-container);border-radius:999px;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex}.question-author{font-family:Kanit,Inter,sans-serif;font-size:.875rem;font-weight:700}.question-time{color:var(--on-surface-variant);font-size:.75rem;font-weight:500}.question-text{color:var(--on-surface);white-space:pre-wrap;overflow-wrap:anywhere;font-family:Bai Jamjuree,Inter,sans-serif;font-size:1.125rem;font-weight:600;line-height:1.4}.question-actions{flex-direction:row;align-items:center;gap:1rem;width:100%;display:flex}@media (width>=640px){.question-actions{flex-direction:column;align-items:flex-end;width:auto}}.vote-btn{border:2px solid var(--outline);color:var(--on-surface-variant);cursor:pointer;background-color:#0000;border-radius:999px;align-items:center;gap:.5rem;padding:.375rem 1rem;transition:all .2s;display:flex}.vote-btn:hover{background-color:var(--surface-container)}.vote-btn.voted{background-color:var(--primary);border-color:var(--primary);color:#fff}.vote-count{font-size:.875rem;font-weight:700}.btn-done{background-color:var(--on-surface);color:#fff;cursor:pointer;border:none;border-radius:.5rem;align-items:center;gap:.5rem;margin-left:auto;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:background-color .2s;display:flex}@media (width>=640px){.btn-done{margin-left:0}}.btn-done:hover{background-color:var(--primary)}.btn-pin{color:var(--on-surface-variant);border:1px solid var(--outline);cursor:pointer;background-color:#0000;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:all .2s;display:flex}.btn-pin:hover{background-color:var(--surface-container);color:var(--on-surface)}.btn-pin.pinned{color:#d97706;background-color:#fef3c7;border-color:#d97706}.display-page{background-image:radial-gradient(circle at 8% 8%,#ffffff24,#0000 26%),radial-gradient(circle at 90% 12%,#f43f5e33,#0000 32%),radial-gradient(circle at 80% 78%,#dc26262e,#0000 28%),linear-gradient(140deg,#3f0b12 0%,#6b1220 45%,#7f1d1d 100%);min-height:100vh;padding:clamp(1rem,2.6vw,2.2rem);background-color:#450a14!important}.display-shell{width:min(1400px,100%);margin:0 auto}.display-header-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#450a14d6;border-radius:1.125rem;margin-bottom:clamp(.9rem,1.8vw,1.35rem);padding:clamp(1rem,2vw,1.65rem) clamp(1rem,2.4vw,1.9rem);box-shadow:0 22px 46px #0206176b}.display-title-row{justify-content:space-between;align-items:center;gap:1rem;display:flex}.display-title{letter-spacing:-.02em;color:#f8fafc;font-family:Bai Jamjuree,Inter,sans-serif;font-size:clamp(1.45rem,2.4vw,2.35rem);font-weight:900}.display-code{color:#fecdd3;text-align:right;background:0 0;border:none;border-radius:0;padding:0;font-size:clamp(1.02rem,1.35vw,1.25rem);font-weight:700;line-height:1.22}.display-code-host{color:#fda4af;font-weight:800}.display-code-value{color:#fff;letter-spacing:.02em;text-shadow:0 2px 8px #7e22ce73;background:linear-gradient(135deg,#f59e0b 0%,#ec4899 45%,#8b5cf6 100%);border-radius:.55rem;margin-left:.35rem;padding:.12rem .5rem;font-size:clamp(1.45rem,2.1vw,1.9rem);font-weight:900;display:inline-block;box-shadow:0 8px 18px #8b5cf659}.display-join-block{align-items:center;gap:clamp(.7rem,1vw,.95rem);display:flex}.display-qr{background:#fff;border-radius:.45rem;width:clamp(64px,8vw,94px);height:clamp(64px,8vw,94px);padding:.22rem;box-shadow:0 10px 24px #02061761}.display-questions{flex-direction:column;gap:clamp(.75rem,1.4vw,1rem);display:flex}.display-question-card{color:#000;background:#fffffff5;border:1px solid #9ca3af;border-radius:1rem;justify-content:space-between;align-items:flex-start;gap:.9rem;padding:clamp(.95rem,1.75vw,1.25rem) clamp(1rem,2vw,1.35rem);transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;box-shadow:0 10px 28px #0f172a33}.display-question-card:hover{border-color:#f43f5ebf;transform:translateY(-1px);box-shadow:0 16px 36px #7f1d1d47}.display-question-card.is-pinned{background:#fffbebf7;border-width:4px;border-color:#f59e0b;border-image:;box-shadow:0 4px 12px #00000026}.display-question-card.is-done{opacity:.3}.display-question-meta{color:#9f1239;text-transform:uppercase;letter-spacing:.04em;justify-content:space-between;margin-bottom:.5rem;font-size:clamp(.84rem,.95vw,.95rem);font-weight:700;display:flex}.display-question-main{flex:1;min-width:0}.display-question-meta span:first-child{font-family:Kanit,Inter,sans-serif}.display-question-text{color:#000;white-space:pre-wrap;overflow-wrap:anywhere;margin-bottom:.7rem;font-family:Bai Jamjuree,Inter,sans-serif;font-size:clamp(1.35rem,2.1vw,1.95rem);font-weight:700;line-height:1.36}.display-votes{text-align:right;color:#be123c;font-size:clamp(.92rem,1.2vw,1.08rem);font-weight:800}.display-question-actions{flex-direction:column;align-items:center;gap:.45rem;display:flex}.display-action-btn{color:#9f1239;cursor:pointer;background:#fff;border:1px solid #fda4af;border-radius:999px;justify-content:center;align-items:center;width:2rem;height:2rem;transition:background-color .15s,border-color .15s,color .15s,transform .15s;display:inline-flex}.display-action-btn:hover{transform:translateY(-1px)}.display-action-btn.pin:hover,.display-action-btn.pin.active{color:#b45309;background:#fef3c7;border-color:#f59e0b}.display-action-btn.done:hover{color:#9f1239;background:#ffe4e6;border-color:#be123c}.display-action-btn.undo:hover{color:#7f1d1d;background:#fee2e2;border-color:#7f1d1d}.display-question-card p{color:#000}@media (width<=640px){.display-title-row{flex-direction:column;align-items:flex-start}.display-join-block{align-self:flex-start}.display-code{text-align:left}}.display-modal-backdrop{z-index:200;background:#450a14b8;justify-content:center;align-items:center;padding:2rem;display:flex;position:fixed;inset:0}.display-modal{box-shadow:none;background:#fff;border-radius:0;flex-direction:column;justify-content:center;padding:clamp(1.25rem,3vw,2.5rem);display:flex;position:fixed;inset:0}.display-modal-close{color:#475569;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:999px;justify-content:center;align-items:center;width:2rem;height:2rem;display:flex;position:absolute;top:1rem;right:1rem}.display-modal-meta{color:#475569;justify-content:flex-start;gap:1rem;margin-bottom:.75rem;font-family:Kanit,Inter,sans-serif;font-size:21px;font-weight:700;display:flex}.display-modal-text{color:#0f172a;white-space:pre-wrap;overflow-wrap:anywhere;max-width:92vw;font-family:Bai Jamjuree,Inter,sans-serif;font-size:59px;font-weight:800;line-height:1.25}.stats-grid{grid-template-columns:1fr;gap:1rem;margin-bottom:2rem;display:grid}@media (width>=768px){.stats-grid{grid-template-columns:repeat(3,1fr)}}.stat-card{background-color:var(--surface);border:1px solid var(--outline);border-radius:1rem;padding:1.5rem;box-shadow:0 1px 2px #0000000d}.stat-label{color:var(--on-surface-variant);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-size:.75rem;font-weight:700}.stat-value{color:var(--on-surface);font-size:2.25rem;font-weight:900}.mobile-nav{background-color:var(--surface);border-top:1px solid var(--outline);z-index:50;justify-content:space-around;align-items:center;width:100%;height:4rem;display:flex;position:fixed;bottom:0;left:0}@media (width>=1024px){.mobile-nav{display:none}}.nav-item{color:var(--on-surface-variant);border-radius:.75rem;flex-direction:column;align-items:center;padding:.5rem 1rem;font-size:.6875rem;font-weight:600;text-decoration:none;display:flex}.nav-item.active{color:var(--primary);background-color:var(--primary-container)}