/* 法廷録 3.2 Mobile Edition — responsive native-app-like presentation.
   All tappable surfaces are real controls; game mechanics and save schema unchanged. */
.mobile-dock,.mobile-app-hint{display:none}
@media(max-width:760px){
 :root{--mobile-dock-height:calc(68px + env(safe-area-inset-bottom,0px))}
 html{scroll-padding-top:122px;overscroll-behavior-y:auto}
 body{font-size:15px;line-height:1.65;-webkit-text-size-adjust:100%;padding-bottom:var(--mobile-dock-height)}
 #app{min-width:0;overflow-x:clip}
 .shell{padding:0 13px calc(var(--mobile-dock-height) + 30px)!important;max-width:100%!important}
 .header{position:sticky;top:0;z-index:45;box-shadow:0 3px 14px #0009}
 .headerin{height:55px;padding:0 13px;gap:9px;max-width:100%}
 .header .nav{display:none}
 .header .brand{flex-shrink:0}
 .header .brandmark{height:36px;width:36px}
 .header .brandtext{font-size:16px}
 .header .brandtext small{font-size:8px;letter-spacing:.15em}
 .header .headright{margin-left:auto;gap:2px}
 .header .rankmini{font-size:11px;padding:5px 7px}
 .header .sound{min-height:43px;min-width:41px;padding:7px}
 .mobile-dock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:85;min-height:var(--mobile-dock-height);padding:6px 8px calc(7px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,#141d31f7,#060c18f9);border-top:1px solid #d1af7888;box-shadow:0 -7px 24px #0009;backdrop-filter:blur(14px);gap:5px}
 .mobile-dock button{border:1px solid transparent;background:transparent;color:#c6cfdb;border-radius:9px;min-height:53px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;padding:4px 2px;cursor:pointer;touch-action:manipulation;position:relative;overflow:hidden}
 .mobile-dock button.primary,.mobile-dock button[aria-current="page"]{color:#f9dca1;background:linear-gradient(165deg,#392f2d,#19263b);border-color:#b79869}
 .mobile-dock .dock-icon{font-size:21px;line-height:26px}
 .mobile-dock .dock-label{font-size:11px;line-height:17px;font-weight:800;white-space:nowrap}
 .mobile-dock button:active{background:#3b4051;transform:none!important}
 body:has(#modal-root .modalback) .mobile-dock{display:none}
 .game-chapter,.q31-chapter{padding:13px 0 9px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 9px;align-items:center}
 .game-chapter h2{font-size:22px;line-height:1.3;margin:2px 0}
 .game-chapter .overline{font-size:10px}
 .game-chapter>.game-button{font-size:11px;min-height:42px;padding:8px 10px;white-space:nowrap}
 .game-chapter>.q31-roster-button{grid-column:1/-1;justify-self:stretch;margin:0;order:initial;min-height:42px}
 .game-play .stepper{position:sticky;top:55px;z-index:22;margin:0 0 10px;box-shadow:0 8px 15px #060c1999;overflow:visible;gap:2px}
 .game-play .stepper>div{padding:9px 1px;min-width:0;white-space:normal;line-height:1.3;font-size:10px;overflow-wrap:anywhere}
 .game-button{min-height:47px;padding:11px 12px;font-size:13px}
 .game-button.full{min-height:52px}
 .panel-heading h3{font-size:21px}
 .game-stage{min-height:315px}
 .chapter-strip{font-size:10px;top:9px;left:9px;max-width:calc(100% - 18px)}
 .story-stage{min-height:360px;height:410px}
 .story-figure{height:76%;width:64%;bottom:76px;left:7%}
 .story-dialog{padding:22px 14px 14px;min-height:113px;left:9px;right:9px;bottom:10px}
 .dialogue-text{font-size:16px;line-height:1.7}
 .story-controls{gap:10px;align-items:stretch;flex-direction:column}
 .story-controls>div{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
 .story-controls .game-button{min-height:48px}
 .client-game-view,.investigation-game,.court-interface{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
 .client-scene{min-height:364px;height:364px}
 .client-actor{height:76%;width:58%;left:21%;bottom:69px}
 .client-dialog{left:10px;right:10px;bottom:9px;min-height:107px;padding:22px 13px 11px}
 .client-dialog p{font-size:16px;line-height:1.58}
 .speaker-tag{font-size:13px;left:9px;top:-15px;padding:3px 10px;max-width:95%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .speaker-tag small{font-size:10px}
 .client-questions{padding:17px 14px;gap:9px}
 .client-questions h3{font-size:22px;margin:6px 0}
 .client-options{gap:8px}
 .option-row{min-height:55px;padding:10px 11px;font-size:15px;line-height:1.5;gap:9px}
 .option-row span:nth-child(2){flex:1;min-width:0}
 .option-index{flex-shrink:0}
 .client-principle{font-size:13px;padding:11px 13px}
 .location-nav{scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;gap:9px;padding:1px 0 7px}
 .location-nav button{scroll-snap-align:start;min-height:47px;font-size:14px}
 .investigation-stage{height:350px;min-height:350px}
 .game-hotspot{width:52px;height:52px;font-size:23px}
 .loc-caption{left:9px;right:9px;bottom:9px;font-size:12px;padding:8px 10px;max-width:none}
 .object-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .object-bar button{font-size:13px;padding:9px;min-height:45px;text-align:left}
 .investigation-sidebar{padding:14px;gap:10px}
 .evidence-scroll{max-height:235px;min-height:0;overscroll-behavior:contain}
 .game-evidence{min-height:60px;padding:9px}
 .evidence-info strong{font-size:14px}
 .evidence-info small{font-size:12px}
 .compare-panel{padding:12px 0 3px}
 .compare-choices{gap:7px}
 .compare-choices select{font-size:16px;padding:12px 8px;width:calc(50% - 11px);height:48px}
 .court-game-stage{height:330px;min-height:330px}
 .court-figure.figure-left{left:-3%;width:47%;height:85%;bottom:16%}
 .court-figure.figure-right{right:-5%;width:50%;height:78%;bottom:16%}
 .court-badge{top:48px;right:5px;max-width:48%;padding:4px 7px}
 .court-badge span{font-size:9px}.court-badge b{font-size:11px}
 .court-dialog{left:9px;right:9px;bottom:9px;padding:22px 12px 9px;min-height:103px}
 .court-dialog p{font-size:15px;line-height:1.6}
 .court-lesson{font-size:12px;margin:9px 0}
 .court-argument,.court-evidence{padding:16px;gap:12px}
 .court-argument h3{font-size:21px}
 .court-evidence .evidence-scroll{max-height:290px}
 .score-meter{padding:11px}
 .q31-court-hint summary,.q31-interview-history summary,.q31-guide summary{min-height:40px;display:block;padding:9px 0;font-size:13px}
 .q31-guide>p,.q31-guide details p,.q31-qa-item p{font-size:13px}
 .q31-cast-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .q31-cast-thumb b{font-size:13px}
 .q31-cast-thumb span{font-size:11px}
 .q31-modal{max-height:calc(100dvh - 24px);width:calc(100vw - 20px);overflow:auto;padding:18px}
 .q31-person-card{min-height:74px}
 .q31-person-detail{grid-template-columns:1fr}
 .q31-person-image img{max-height:220px;width:auto;max-width:100%;object-fit:contain}
 .q31-evidence-preview h3{font-size:19px}
 .q31-evidence-preview p{font-size:14px}
 .q31-modal-actions button{min-height:50px}
 .lawlayout{display:flex;flex-direction:column;gap:12px}
 .lawlayout>aside{width:100%;min-width:0}
 .lawgroups{display:flex;gap:7px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:9px;-webkit-overflow-scrolling:touch}
 .lawgroup{flex:0 0 auto;min-width:138px;width:auto;max-width:165px;min-height:68px;padding:9px;scroll-snap-align:start}
 .lawgroup strong{font-size:13px}
 .lawgroup small{font-size:10px}
 .lawlayout>div:last-child{width:100%;min-width:0}
 .lawlist{display:grid;grid-template-columns:minmax(0,1fr)!important}
 .lawentry{min-height:91px;padding:13px}
 .field,input,textarea,select{max-width:100%}
 input,textarea,select{font-size:16px!important}
 .sectiontop{margin:20px 0 14px;flex-wrap:wrap}
 .sectiontop h1,.sectiontop h2{font-size:25px}
 .grid2,.grid3,.grid4{grid-template-columns:minmax(0,1fr)!important}
 .title-content{min-height:100dvh;padding:10px 12px 28px}
 .title-keyart{height:32svh;min-height:180px}
 .title-panel{padding:20px 17px;min-height:0}
 .title-panel h1{font-size:46px}
 .title-slogan{margin:12px 0 14px}
 .title-actions{grid-template-columns:1fr 1fr;gap:8px}
 .title-actions .game-button{font-size:14px;min-height:50px}
 .title-notice{font-size:12px}
 .mobile-app-hint{display:block;text-align:center;background:#162337;color:#dccba9;border:1px solid #8c7857;margin-top:14px;padding:10px;font-size:12px;line-height:1.7}
 .home-hero{min-height:345px}
 .home-copy{padding:25px 18px}
 .home-copy h1{font-size:31px}
 .home-copy .home-lead{font-size:14px}
 .game-case-grid{grid-template-columns:minmax(0,1fr)}
 .q31-return-case{bottom:calc(var(--mobile-dock-height) + 9px);right:11px}
 .modalback{padding:12px;align-items:center}
 .modal{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
 .modal .modalactions{display:flex;gap:9px;flex-wrap:wrap}
 .modal .modalactions .btn{min-height:46px}
 .notefield{min-height:160px}
 .game-title{margin-bottom:calc(-1 * var(--mobile-dock-height))}
 .game-title + .mobile-dock{display:none}
}
@media(max-width:370px){.header .brandtext small{font-size:7px}.header .rankmini{display:none}.chapter-strip{font-size:9px}.game-chapter h2{font-size:19px}.title-actions .game-button{font-size:12px}.mobile-dock .dock-label{font-size:10px}.client-dialog p{font-size:15px}}
@media(max-width:760px) and (orientation:landscape){.title-content{display:grid;grid-template-columns:1fr 1fr}.title-keyart{height:65svh}.client-scene{height:300px;min-height:300px}.investigation-stage{height:320px;min-height:320px}.court-game-stage{height:320px;min-height:320px}}
@media(prefers-reduced-motion:reduce){.mobile-dock *, .mobile-dock{animation:none!important;transition:none!important}}
