:root{
  --gold:#d4af37;
  --gold-light:#f5d36b;
  --gold-pale:#fff0b5;
  --safe-top:max(10px,env(safe-area-inset-top));
  --safe-bottom:max(10px,env(safe-area-inset-bottom));
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#000}
body{position:fixed;inset:0;font-family:Arial,"Microsoft YaHei",sans-serif;color:#fff;user-select:none;-webkit-user-select:none;touch-action:manipulation}
button,input{font:inherit} input{user-select:text;-webkit-user-select:text}
.orvo-game{width:100%;height:100dvh;min-height:100svh;position:relative;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;padding:calc(var(--safe-top) + 4px) 12px calc(var(--safe-bottom) + 4px);background:radial-gradient(circle at 85% 0%,rgba(212,175,55,.32),transparent 30%),radial-gradient(circle at 12% 100%,rgba(120,70,0,.2),transparent 35%),linear-gradient(180deg,#0b0905 0%,#000 100%)}
.game-header{position:relative;min-height:70px;display:flex;align-items:flex-start;justify-content:center;padding:2px 54px 7px;z-index:5}
.circle-button{position:absolute;top:0;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--gold);background:rgba(0,0,0,.76);color:var(--gold-light);text-decoration:none;box-shadow:0 0 16px rgba(212,175,55,.18);cursor:pointer}
#homeButton{left:0} #rulesButton{right:0;font-size:18px;font-weight:900}
#homeButton svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.title-wrap{text-align:center;min-width:0}.game-name{color:var(--gold-light);font-size:clamp(20px,6vw,27px);font-weight:900;letter-spacing:2px;white-space:nowrap}.tagline{margin-top:5px;color:#d7c38a;font-size:11px;letter-spacing:.6px}
.screen{display:none;height:100%;min-height:0;overflow:hidden}.screen.active{display:block}.hidden{display:none!important}
.panel-shell{height:100%;min-height:0;overflow:hidden;border:1px solid rgba(212,175,55,.34);border-radius:24px;background:linear-gradient(180deg,rgba(25,19,8,.88),rgba(0,0,0,.92));box-shadow:0 0 34px rgba(212,175,55,.14),inset 0 0 36px rgba(212,175,55,.05)}
.start-panel{display:grid;grid-template-rows:auto auto auto auto;align-content:center;gap:13px;padding:16px}
.logo-wrap{width:138px;height:138px;margin:auto;display:grid;place-items:center;border-radius:28px;border:1px solid rgba(212,175,55,.4);background:radial-gradient(circle,rgba(212,175,55,.18),transparent 60%);box-shadow:0 0 26px rgba(212,175,55,.2)}
.logo{width:122px;height:122px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,216,107,.38))}
.hero-copy{text-align:center}.hero-copy h1{color:var(--gold-light);font-size:25px;letter-spacing:1.5px}.hero-copy p{margin-top:6px;color:#ddd;font-size:12px;line-height:1.5}
.setup-card{padding:14px;border-radius:18px;border:1px solid rgba(212,175,55,.24);background:rgba(255,255,255,.035);text-align:center}.setup-card label{display:block;color:var(--gold-pale);font-size:13px;font-weight:800;margin-bottom:9px}
.count-row{display:flex;justify-content:center;align-items:center;gap:9px}.count-row input{width:88px;padding:10px;border-radius:11px;border:1px solid var(--gold);background:#060606;color:var(--gold-pale);text-align:center;font-size:17px;font-weight:900}
.mini-btn{width:44px;height:42px;border-radius:12px;border:1px solid var(--gold);background:linear-gradient(145deg,#f7dc77,#9b6a18);color:#050505;font-size:22px;font-weight:900}
.library-info{margin-top:11px;color:#d7d7d7;font-size:12px;line-height:1.45}.library-info b{color:var(--gold-light)}
.main-btn,.ghost-btn,.option{border-radius:999px;border:1px solid var(--gold);font-weight:900;cursor:pointer}.main-btn{min-height:46px;background:linear-gradient(145deg,#f7dc77,#9b6a18);color:#050505}.ghost-btn{min-height:42px;background:rgba(255,255,255,.04);color:var(--gold-pale);border-color:rgba(212,175,55,.42)}
.game-layout{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;overflow:hidden}
.stats-row{display:grid;grid-template-columns:1.15fr .8fr .95fr;gap:7px}.stat-box{padding:7px 6px;border-radius:13px;border:1px solid rgba(212,175,55,.24);background:rgba(255,255,255,.035);text-align:center;min-width:0}.stat-box span{display:block;color:#927d45;font-size:8px;font-weight:900;letter-spacing:.7px}.stat-box b{display:block;margin-top:3px;color:var(--gold-light);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.question-card{min-height:0;display:grid;grid-template-rows:auto auto auto auto auto minmax(0,1fr);align-content:start;overflow:hidden;padding:11px;border-radius:22px;border:1px solid rgba(212,175,55,.34);background:linear-gradient(180deg,rgba(22,17,8,.9),rgba(0,0,0,.88));box-shadow:inset 0 0 35px rgba(212,175,55,.05)}
.mode{justify-self:center;padding:5px 11px;border-radius:999px;background:rgba(212,175,55,.14);color:var(--gold-light);font-size:10px;font-weight:900;letter-spacing:.6px}
.word-card{width:min(39vw,158px);aspect-ratio:1;margin:8px auto;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:21px;border:2px solid rgba(212,175,55,.48);background:radial-gradient(circle at center,rgba(255,216,107,.2),transparent 48%),linear-gradient(180deg,#1b1407,#050505);box-shadow:0 0 26px rgba(212,175,55,.18),inset 0 0 24px rgba(212,175,55,.08);color:#ffe27a}
.big-word{font-weight:900;line-height:1;text-shadow:0 0 18px rgba(255,216,107,.72)}.parts{display:flex;align-items:center;justify-content:center;gap:7px;font-size:35px;font-weight:900}.stack{display:flex;flex-direction:column;line-height:1;font-size:43px;font-weight:900}
.hint{color:#c9a950;font-size:11px;line-height:1.4;text-align:center;min-height:16px}.question{color:#fff;font-size:16px;line-height:1.4;font-weight:800;text-align:center;margin:7px 0}
.options{display:grid;grid-template-columns:1fr 1fr;gap:7px}.option{min-height:42px;padding:9px 10px;border-radius:13px;background:linear-gradient(145deg,#211600,#5b4308);color:#fff4c5;text-align:left;font-size:12px;line-height:1.3}.option:active,.main-btn:active,.ghost-btn:active{transform:translateY(2px)}
.result-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;margin-top:7px;color:#fff;font-size:12px;line-height:1.5;text-align:left}.good,.bad{text-align:center;font-size:16px;font-weight:900;padding:6px}.good{color:#7cff9b}.bad{color:#ff8c8c}.info{margin:6px 0;padding:8px 9px;border-radius:10px;background:rgba(255,255,255,.055)}.result-scroll .main-btn{width:100%;min-height:38px;margin:5px 0}
.game-actions{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:7px}.game-actions button{width:100%}
.ranking-panel{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:9px;padding:15px}.ranking-icon{font-size:52px;text-align:center;filter:drop-shadow(0 0 16px rgba(212,175,55,.45))}.ranking-panel h1{text-align:center;color:var(--gold-light);font-size:24px}.ranking-list{min-height:0;overflow-y:auto;padding:10px;border-radius:16px;border:1px solid rgba(212,175,55,.22);background:rgba(255,255,255,.03);color:#fff;line-height:1.8;font-size:14px}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rules-panel{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:calc(var(--safe-top) + 14px) 16px calc(var(--safe-bottom) + 14px);background:rgba(0,0,0,.86);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:.2s}.rules-panel.open{opacity:1;pointer-events:auto}.rules-card{width:min(100%,390px);max-height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid var(--gold);border-radius:20px;background:linear-gradient(180deg,#171207,#070707)}.rules-head{display:flex;align-items:center;justify-content:space-between;padding:14px 15px;border-bottom:1px solid rgba(212,175,55,.2)}.rules-head h3{color:var(--gold-light);font-size:17px}#closeRules{width:36px;height:36px;border-radius:50%;border:1px solid rgba(212,175,55,.55);background:transparent;color:#fff;font-size:20px}.rules-scroll{min-height:0;overflow-y:auto;padding:8px 15px 15px}.rule-item{padding:10px 0;border-bottom:1px solid rgba(212,175,55,.14);color:#f2dfaa;font-size:13px;line-height:1.5}
@media(max-height:720px){.game-header{min-height:59px;padding-bottom:2px}.circle-button{width:38px;height:38px}.tagline{margin-top:2px}.start-panel{gap:8px;padding:11px}.logo-wrap{width:100px;height:100px}.logo{width:90px;height:90px}.hero-copy h1{font-size:20px}.setup-card{padding:10px}.question-card{padding:8px}.word-card{width:min(31vw,125px);margin:5px auto}.question{font-size:14px;margin:4px 0}.option{min-height:36px;padding:7px;font-size:11px}.game-actions button{min-height:36px;font-size:11px}}
@media(min-width:700px){.orvo-game{width:min(100%,460px);margin:auto;border-left:1px solid rgba(212,175,55,.14);border-right:1px solid rgba(212,175,55,.14)}}
