/* PQパーティ / coral-apricot design candidate / 2026-10-11 */
:root{--bg:#fff4e5;--bg2:#f6e3cb;--panel:#fffdf5;--paper:#fffaf0;--ink:#48382c;--muted:#766353;--line:#dec6a7;--gold:#bd7433;--rose:#bd503d;--teal:#426f56;--green:#426f56;--danger:#a83332;--shadow:0 10px 28px #63402217;--pc-forest:#704330;--pc-green:#a34832;--pc-mint:#fff0db;--pc-ink:#48382c;--pc-muted:#766353;--pc-line:#dec6a7}
body,body:has(.party-console){background:linear-gradient(135deg,#fff7e9,#fbe7d5);color:var(--ink)}
h1,h2,h3,.welcome-title,.landing-copy h2,.role-card strong{font-family:"Yu Gothic","Meiryo",sans-serif;font-weight:800;letter-spacing:.02em}
.topbar{background:#fffcf3;color:var(--ink);padding:14px 22px;border-radius:22px;border:1px solid var(--line);box-shadow:var(--shadow);gap:16px}
.pq-party-logo{display:block;width:300px;max-width:100%;height:auto}.brand-home{flex-shrink:1;min-width:0}.topbar-side{flex-wrap:wrap}
.topbar .status{color:var(--ink);background:#f8eddc;border-color:var(--line)}
.landing{max-width:1440px;margin:auto;padding:20px}
.landing-hero{grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:24px;margin-top:24px}
.landing-copy{min-height:700px;border-radius:30px;background: url('./assets/pq-party/pq-party-garden-v1.png') center/cover;border:4px solid #fffaf0;box-shadow:var(--shadow);padding:30px;color:#48382c;overflow:hidden}
.landing-copy::before{background:linear-gradient(180deg,#fffcf3ed,transparent 55%);opacity:1}
.landing-copy::after{display:none}.landing-copy h2{font-size:clamp(30px,3.5vw,48px);line-height:1.4;color:#593b2c;text-shadow:none;margin:10px 0}
.landing-copy .lead,.landing-copy .eyebrow{color:#593b2c}.hero-stats{background:#fffcf3ed;border-radius:20px;padding:16px;max-width:400px}.hero-stats strong{color:#a34832}
.role-board{gap:12px}.role-card,.role-card:hover{background:#fffdf5;color:#48382c;border:1px solid #dec6a7;border-radius:24px;box-shadow:0 5px 0 #dcc4a5;padding:20px 22px 20px 90px;min-height:112px;position:relative;text-align:left}
.role-card::before{content:"";position:absolute;left:15px;top:24px;width:62px;height:62px;background:var(--animal) center/contain no-repeat}
.role-card::after{color:#bd503d}.role-card strong{color:#48382c;font-size:22px}.role-card small{color:#766353}.role-kicker{color:#a34832}
.partylist-role{--animal:url('./assets/pq-party/RA37.webp')}.host-role{--animal:url('./assets/pq-party/RA45.webp')}.player-role{--animal:url('./assets/pq-party/RA17.webp')}.profile-role{--animal:url('./assets/pq-party/RA41.webp')}.precheck-role{--animal:url('./assets/pq-party/RA37.webp')}.diagnosis-results-role{--animal:url('./assets/pq-party/RA17.webp')}.game-guide-role{--animal:url('./assets/pq-party/RA45.webp')}
.panel,.hero,.card,.notice,.host-current-stage,.host-primary-tabs{border-color:var(--line);border-radius:20px;box-shadow:var(--shadow)}
.button{border-radius:14px;border-color:var(--line);background:#fff8eb;color:#583f2d;min-height:44px}
.button.primary{background:#ae4935;border-color:#963c2b;color:#fffdf5;box-shadow:0 4px 0 #7f3627}
.button.secondary,.button.ghost{color:#74452e;border-color:#d8b895}
input,textarea,select{border-radius:12px;border-color:var(--line);background:#fffdf8;color:var(--ink)}
:focus-visible{outline:3px solid #426f56;outline-offset:3px}
.mark{background:#bd503d;color:white;border-radius:16px}
.remote-app,.local-projector-remote-preview{background:#fff2df;color:var(--ink)}
.remote-header h1,.remote-status,.remote-status-toggle{color:var(--ink)}
.remote-status,.remote-display-card,.remote-progress-actions,.remote-scroll-control{background:#fffcf3;border-color:var(--line)}
.remote-header span,.remote-display-heading{border-color:var(--line)}
.remote-status b,.remote-status-chevron{color:#426f56}
.party-console,.party-console-header,.party-console-drawer,.party-console-drawer-head{--pc-forest:#704330;--pc-green:#a34832;--pc-mint:#fff0db;--pc-ink:#48382c;--pc-muted:#766353;--pc-line:#dec6a7}
.party-console-now,.party-console-surface,.party-console-rail,.party-console-tools{border-radius:22px;background:#fffdf5;border-color:var(--line)}
/* Projected information retains a dark warm surface for large-room contrast. */
.projector-shell{background:#382f29;color:#fff5e7}.party-console-screen{background:linear-gradient(145deg,#48382c,#704b34);color:#fff5e7}
@media(max-width:780px){.landing{padding:10px}.topbar{padding:10px;flex-wrap:wrap}.pq-party-logo{width:248px}.topbar-side{width:100%;justify-content:flex-start}.landing-hero{grid-template-columns:1fr;gap:16px}.landing-copy{min-height:530px;padding:22px;background-position:58% center}.landing-copy h2{font-size:32px}.role-card{min-width:0}.role-board{grid-template-columns:1fr}.hero-stats{font-size:12px}.remote-shell{max-width:100%}}

.hero-stats>div{background:#fffaf0;color:#48382c;border:1px solid #dec6a7;border-radius:14px}.hero-stats span{color:#635143}.landing-copy>.lead{background:#fff9eeeb;padding:12px 16px;border-radius:14px}.landing-copy .eyebrow{margin-top:0}.landing-copy{align-content:start}.landing-copy::before{background:linear-gradient(180deg,#fffaf0ef 0%,#fffaf085 28%,transparent 60%)}
.hero-stats>div{min-width:0}.hero-stats strong{font-size:clamp(20px,5vw,30px)}.hero-stats span{overflow-wrap:anywhere}.party-console-header{background:linear-gradient(120deg,#824d35,#9b553c)}.party-console-screen h3,.party-console-screen h4{color:#fff4e3}.party-console-screen .card h3,.party-console-screen .card h4{color:#48382c}


/* Application-wide surfaces: keep data, game colors and status semantics intact. */
.eyebrow,.label{color:#9a4735}
.shell:not(.projector-shell),.welcome-page,.mask-reveal-page{color:var(--ink)}
.hero,.welcome-card,.welcome-content,.welcome-account-card,.login-modal,.login-modal-panel,.diagnosis-result-card,.diagnosis-result-detail,.mask-reveal-card,.question-card,.survey-card{background:#fffdf5;color:var(--ink);border-color:var(--line);border-radius:22px;box-shadow:var(--shadow)}
.welcome-title,.mask-reveal-title,.mask-reveal-name{color:#704330}
.welcome-subtitle,.welcome-login-note,.mask-reveal-desc,.mask-reveal-voice{color:#766353}
.welcome-hero{background:linear-gradient(#fff8eae8,#fff8eaee),url('./assets/pq-party/pq-party-garden-v1.png') center/cover}
.welcome-primary-action,.welcome-login-section .auth-button,.btn-primary{background:#ae4935;color:#fffdf5;border-color:#963c2b}
.host-admin-tab.is-active,.host-admin-tab.active,.host-program-index button.is-active{background:#ae4935;color:#fffdf5;border-color:#963c2b}
.host-program-card,.program-item,.diagnosis-answer-history li{background:#fff8ec;border-color:#dec6a7;color:var(--ink)}
.host-program-card.is-current,.program-item.active{border-color:#b45139;background:#ffebd8}
.party-console-header{background:linear-gradient(120deg,#824d35,#9b553c)}
.party-console-header .eyebrow,.party-console-header .label{color:#ffead2}
.party-console-connection{background:#704330}
.party-console-now .button.primary,.party-console-next .button.primary{background:#ae4935;color:#fffdf5;border-color:#963c2b}
.party-console-screen .label,.party-console-screen .eyebrow,.projector-shell .eyebrow{color:#f5cf9c}
.party-console-screen .panel,.party-console-screen .card{color:#48382c}
.party-console-screen h3,.party-console-screen h4{color:#fff4e3}
.party-console-screen :is(.panel,.card) :is(h3,h4){color:#48382c}
.remote-zoom-card,.remote-display-card,.remote-progress-actions,.remote-scroll-control{background:#fffdf5;border-color:var(--line);box-shadow:var(--shadow)}
.remote-display-heading strong,.remote-scroll-title,.remote-volume-label,.remote-header h1{color:#704330}
.remote-dpad button,.remote-actions button,.remote-transport button,.remote-zoom-buttons button,.remote-scroll-button,.remote-maximize-toggle,.remote-progress-actions button{background:linear-gradient(#fff8eb,#f0dcc2);color:#583f2d;border-color:#caa884;box-shadow:0 4px 0 #d5b995}
.remote-dpad .remote-enter,.remote-actions .remote-next,.remote-progress-actions button:last-child,.remote-maximize-toggle.is-active{background:#ae4935;color:white;border-color:#963c2b}
.remote-transport #remoteStart{background:#426f56;color:white}.remote-transport #remoteStop{background:#a83332;color:white}
.remote-shell .field-note{color:#766353}
.projector-shell .topbar{color:#48382c}.projector-shell .panel{background:#fffdf5;color:#48382c}
.projector-shell .panel .eyebrow{color:#9a4735}
body.kagameel-share-result{background:linear-gradient(135deg,#fff7e9,#fbe7d5)}
.kagameel-share-result .btn-primary,.btn-primary{background:#ae4935;color:#fffdf5;box-shadow:0 4px 0 #7f3627}
.kagameel-share-result .btn-ghost,.btn-ghost{color:#8c402e;border-color:#c69b78}
.kagameel-public-score strong{color:#ae4935}
.kagameel-public-animal:nth-child(2){background:#fff1e2}
.error-block h2{color:#a83332}.error-block p,.loading,.footer-note{color:#766353}
@media(max-width:480px){.pq-party-logo{width:min(248px,100%)}.hero-stats{gap:6px;padding:8px}.hero-stats>div{min-width:0;padding:8px}.hero-stats strong{font-size:22px;letter-spacing:0}.role-card strong{font-size:20px}.topbar-side>*{max-width:100%}.welcome-title{overflow-wrap:anywhere}.remote-display-heading{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.role-card{transition:none}}

.party-console .button.primary{background:#ae4935;color:#fffdf5;border-color:#963c2b}.diagnosis-results-hero{min-height:220px;padding-right:120px;background:#fffdf5 url("./assets/pq-party/RA17.webp") right 24px bottom 20px/90px no-repeat}.precheck-hero{min-height:220px}.remote-zoom-card strong{color:#8c402e}

.pqface-logo-brand{flex-shrink:1}.pqface-brand-context{display:none}

/* Keep signed-in account details legible on the light party header. */
.topbar .status-text small { color: #6b5140; opacity: 1; }

/* Party list: readable text and card boundaries on the cream theme. */
main:has(> .party-section) > h2 { color: #48382c !important; }
.party-list-guide,.party-section-state,.party-list-host,.party-list-venue { color: #6b5140; }
.party-section { background: #fff8ec; border-color: #dec6a7; }
.party-section-label,.party-list-code { color: #93432e; }
.party-list-item { color: #48382c; background: #fffdf5; border-color: #dec6a7; }
.party-list-info strong { color: #48382c; }
.party-list-item:hover { background: #ffedd8; border-color: #aa6441; }
.party-list-item:disabled:hover,.party-list-item.is-inactive:hover { background: #fffdf5; border-color: #dec6a7; }
.party-list-item .phase-badge { color: #513f30; background: #efe1c9; }
.party-list-action.gold { color: #fffdf5; background: #a34832; border-color: #873b29; }
.party-section.is-inactive { opacity: 1; filter: none; background: #eee8dd; }
.party-section.is-inactive .party-list-item { background: #f5f1e9; border-style: dashed; }