/* Sifr Ghibli Cast & Staff Quiz v0.1.1
 * Functional migration of the legacy quiz. The redesign is intentionally deferred.
 */
.sgcsq-wrap,
.sgcsq-wrap * { box-sizing: border-box; }

.sgcsq-wrap {
  width: 100%;
  margin: 0;
  padding: 0 0 20px;
  background: #f0f0f0;
  font-family: "Zen Antique", serif;
  color: #222;
}

.sgcsq {
  width: 100%;
  margin: 0 auto;
}

.sgcsq .sgcsq-legacy-title {
  width: min(100%, 642px);
  aspect-ratio: 642 / 123;
  margin: 0 auto;
  background: url("https://www.sifrinsight.com/wp-content/uploads/ghibli-cast-staff.png") center center / contain no-repeat;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}

.sgcsq .sgcsq-container {
  width: min(100%, 640px);
  min-height: 440px;
  margin: 0 auto;
  padding: 20px;
  text-align: center;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,.1);
  position: relative;
  overflow-x: hidden;
}

.sgcsq .sgcsq-screen {
  min-height: 400px;
  margin-top: 20px;
}

.sgcsq [hidden] { display: none !important; }

.sgcsq .sgcsq-intro {
  width: 100%;
  margin-bottom: 20px;
  text-align: justify;
}

.sgcsq .sgcsq-intro p { line-height: 1.8; }
.sgcsq .sgcsq-intro-link { width: 100%; text-align: right; margin: -10px 0 0; }
.sgcsq .sgcsq-intro-link-pdf { margin-top: -16px; }

.sgcsq .sgcsq-start h2 {
  margin: 18px 0 10px;
  font-size: 1.35rem;
  line-height: 1.35;
}

.sgcsq button { font-family: inherit; }

.sgcsq .sgcsq-start-btn,
.sgcsq .sgcsq-next-btn,
.sgcsq .sgcsq-choice-btn,
.sgcsq .sgcsq-ranking-btn,
.sgcsq .sgcsq-back-button,
.sgcsq .sgcsq-share-btn,
.sgcsq .sgcsq-tab,
.sgcsq .sgcsq-ranking-tab,
.sgcsq [data-action="submit-nickname"] {
  cursor: pointer;
  border-radius: 5px;
}

.sgcsq .sgcsq-start-btn {
  border: 0;
  padding: 10px 20px;
  font-size: 16px;
  background: #29c;
  color: #fff;
}

.sgcsq .sgcsq-start-spacer { height: 30px; }

.sgcsq .sgcsq-next-btn {
  margin-top: 20px;
  padding: 10px 20px;
  background: #ccc;
  font-size: 16px;
  border: 1px solid #999;
}

.sgcsq .sgcsq-choice-btn {
  display: block;
  width: 80%;
  min-height: 44px;
  margin: 5px auto;
  padding: 10px;
  border: 1px solid #ccc;
  background: #e0e0e0;
  font-size: 16px;
  line-height: 1.45;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (hover:hover) {
  .sgcsq .sgcsq-choice-btn:not(:disabled):hover { background: #d0d0d0; }
}

.sgcsq .sgcsq-choice-btn.is-correct {
  background: #29c !important;
  color: #fff;
}

.sgcsq .sgcsq-choice-btn.is-wrong {
  background: #d00 !important;
  color: #fff;
}

.sgcsq .sgcsq-back-button {
  position: absolute;
  top: 10px;
  right: 10px;
  border: 0;
  padding: 5px 8px;
  background: #888;
  color: #fff;
  font-size: 12px;
  z-index: 3;
}

.sgcsq .sgcsq-tabs,
.sgcsq .sgcsq-ranking-tabs {
  margin-bottom: 20px;
  text-align: center;
}

.sgcsq .sgcsq-tab,
.sgcsq .sgcsq-ranking-tab {
  display: inline-block;
  margin: 4px;
  padding: 6px 12px;
  border: 1px solid #ccc;
  background: #eee;
  color: #222;
}

.sgcsq .sgcsq-tab.is-selected,
.sgcsq .sgcsq-ranking-tab.is-selected { background: #ccf; }

.sgcsq .sgcsq-ranking-btn {
  border: 0;
  padding: 11px 12px;
  background: #c93;
  color: #fff;
  font-size: 12px;
}

.sgcsq .sgcsq-progress {
  margin-bottom: 20px;
  text-align: left;
}

.sgcsq .sgcsq-question-container {
  width: 100%;
  min-height: 220px;
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.sgcsq .sgcsq-question-text {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  font-size: clamp(20px, 4.2vw, 25px);
  line-height: 1.65;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.sgcsq .sgcsq-image-heading { margin: 20px 0 16px !important; }
.sgcsq .sgcsq-image-heading img { max-width: 100%; height: auto; }

.sgcsq .sgcsq-result { font-size: 20px; }
.sgcsq .sgcsq-result p { margin: .7em 0; }

.sgcsq .sgcsq-nickname-area { margin-bottom: 10px; }
.sgcsq [data-role="nickname"] {
  max-width: 100%;
  padding: .5em;
  color: #555;
  border: 1px solid #ddd;
  box-shadow: 1px 1px 2px 0 #aaa inset;
  border-radius: 4px;
}
.sgcsq [data-action="submit-nickname"] {
  padding: .3rem 1rem;
  border: 1px solid #bbb;
  background: #eee;
}

.sgcsq .sgcsq-share-btn {
  margin-top: 10px;
  padding: 10px 20px;
  border: 0;
  background: #1da1f2;
  color: #fff;
}

.sgcsq .sgcsq-ranking-content {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.sgcsq .sgcsq-ranking-table {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  border-collapse: collapse;
}
.sgcsq .sgcsq-ranking-table th,
.sgcsq .sgcsq-ranking-table td {
  border: 1px solid #aaa;
  padding: 7px 8px;
  text-align: center;
  overflow-wrap: anywhere;
}
.sgcsq .sgcsq-ranking-bottom-back { margin-top: 15px; }

.sgcsq .sgcsq-adtest {
  width: min(100%, 640px);
  min-height: 350px;
  margin: 20px auto 0;
  overflow: hidden;
}

@media (max-width: 480px) {
  .sgcsq .sgcsq-container { padding: 14px; }
  .sgcsq .sgcsq-tab[data-transition="button"] { display: none; }
  .sgcsq .sgcsq-question-container { min-height: 190px; padding: 10px 2px; }
  .sgcsq .sgcsq-question-text { font-size: clamp(18px, 5.2vw, 22px); }
  .sgcsq .sgcsq-choice-btn { width: 94%; }
  .sgcsq .sgcsq-result { font-size: 17px; }
}

@media (min-width: 481px) {
  .sgcsq .sgcsq-tab[data-transition="swipe"] { display: none; }
}

.sgcsq,.sgcsq *{box-sizing:border-box;}
.sgcsq{width:100%;margin:0;font-family:"Zen Antique","Yu Mincho","Hiragino Mincho ProN",serif;color:#222;}

/* ================================================================
   v0.1.2 — Series title screen
   The game/result/ranking UI below remains the v0.1.1 functional UI.
   ================================================================ */
html.sgcsq-app-html,
html.sgcsq-app-html body{margin:0!important;padding:0!important;width:100%;min-height:100%;}
body.sgcsq-app-page{
  --sgcsq-admin-bar-offset:0px;
  margin:0!important;
  padding:0!important;
  background:#f0eee7;
  color:#20372e;
}
html.sgcsq-admin-bar-showing body.sgcsq-app-page{--sgcsq-admin-bar-offset:32px;}
@media(max-width:782px){html.sgcsq-admin-bar-showing body.sgcsq-app-page{--sgcsq-admin-bar-offset:46px;}}
body.sgcsq-app-page #wpadminbar{position:fixed!important;}
body.sgcsq-app-page.sgcsq-state-start{overflow:hidden!important;}
body.sgcsq-app-page:not(.sgcsq-state-start){overflow-x:hidden!important;overflow-y:auto!important;}
.sgcsq-app-main{width:100%;min-height:calc(100dvh - var(--sgcsq-admin-bar-offset));margin:0;padding:0;}
.sgcsq-sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
.sgcsq[data-screen="start"]{height:calc(100dvh - var(--sgcsq-admin-bar-offset));}
.sgcsq .sgcsq-screen-start{
  width:100%;height:100%;min-height:0;margin:0!important;padding:0;overflow:hidden;
}
.sgcsq-title-stage{
  position:relative;width:100vw;height:100%;margin:0;overflow:hidden;container-type:inline-size;
  color:#1e3b30;font-family:"Yu Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  background:#ead09a url("../images/paper-texture.webp") center/520px 520px repeat;
  isolation:isolate;
}
.sgcsq-title-stage::before{
  content:"";position:absolute;inset:0;z-index:-3;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,250,224,.96) 0 18%,rgba(255,244,206,.62) 38%,rgba(216,174,91,.12) 70%,rgba(97,66,30,.13) 100%),
    linear-gradient(90deg,rgba(117,79,28,.10),transparent 18%,transparent 82%,rgba(117,79,28,.10));
}
.sgcsq-title-stage::after{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  box-shadow:inset 0 0 90px rgba(89,58,21,.18);
}
.sgcsq-title-header-line{position:absolute;left:22%;right:22%;top:6.8%;height:1px;background:rgba(85,73,45,.42);}
.sgcsq-mobile-header{position:absolute;z-index:8;left:23%;right:23%;top:2.1%;height:4.2%;display:flex;align-items:center;justify-content:space-between;}
.sgcsq-title-brand,.sgcsq-title-help{
  color:#2f3e34;text-decoration:none;font-weight:600;line-height:1;letter-spacing:.035em;white-space:nowrap;
}
.sgcsq-title-brand{font-size:clamp(11px,.82cqw,17px);}
.sgcsq-title-help{font-size:clamp(11px,.78cqw,16px);}
.sgcsq-title-copy{position:absolute;z-index:3;left:20%;top:10.5%;width:60%;text-align:center;}
.sgcsq-title-kicker{font-size:clamp(8px,.54cqw,11px);letter-spacing:.34em;color:#9a7221;font-weight:700;margin-bottom:.6em;}
.sgcsq-title-copy h2{margin:0!important;padding:0!important;border:0!important;background:none!important;color:#1b4a39!important;font-size:clamp(27px,2.55cqw,52px)!important;font-weight:600!important;line-height:1.2!important;letter-spacing:.035em!important;text-shadow:0 1px rgba(255,255,255,.5);}
.sgcsq-title-copy p{margin:.55em 0 0!important;font-size:clamp(14px,1.25cqw,25px);font-weight:500;letter-spacing:.035em;color:#344b40;}
.sgcsq-title-mobile-break{display:none;}

.sgcsq-title-visual{position:absolute;z-index:2;left:27%;top:31%;width:46%;height:31%;filter:drop-shadow(0 13px 11px rgba(74,48,21,.18));}
.sgcsq-credit-board,.sgcsq-credit-card{position:absolute;border:1px solid rgba(188,142,30,.86);box-shadow:0 5px 13px rgba(58,42,25,.22);}
.sgcsq-credit-board{
  left:23%;top:8%;width:54%;height:83%;z-index:4;border-radius:4px;
  background:linear-gradient(150deg,#163f31,#0e2d24 72%,#173b2f);color:#f6e5b3;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4%;
  outline:1px solid rgba(242,206,116,.34);outline-offset:-7px;
}
.sgcsq-credit-board::before,.sgcsq-credit-board::after{content:"✦";position:absolute;color:#cba344;font-size:clamp(10px,1.15cqw,23px);top:7%;}
.sgcsq-credit-board::before{left:7%;}.sgcsq-credit-board::after{right:7%;}
.sgcsq-credit-board-top{font-size:clamp(9px,.76cqw,15px);letter-spacing:.28em;margin-bottom:7%;}
.sgcsq-credit-board-main{font-family:Georgia,"Times New Roman",serif;font-size:clamp(18px,1.55cqw,32px);line-height:1.18;letter-spacing:.09em;font-weight:600;}
.sgcsq-credit-board-rule{width:58%;height:1px;background:#b68c2f;margin:7% 0 5%;}
.sgcsq-credit-board-small{font-size:clamp(7px,.48cqw,10px);letter-spacing:.14em;white-space:nowrap;opacity:.9;}
.sgcsq-credit-card{
  width:31%;height:45%;background:#f7edce;color:#264b3c;padding:4% 3%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;
  background-image:linear-gradient(rgba(255,255,255,.26),rgba(255,255,255,0));
}
.sgcsq-credit-card span{font-family:Georgia,"Times New Roman",serif;font-size:clamp(7px,.48cqw,10px);letter-spacing:.14em;color:#9a7429;margin-bottom:8%;}
.sgcsq-credit-card strong{font-size:clamp(14px,1.2cqw,24px);font-weight:600;white-space:nowrap;}
.sgcsq-credit-director{left:2%;top:4%;transform:rotate(-6deg);z-index:1;}
.sgcsq-credit-cast{right:2%;top:2%;transform:rotate(6deg);z-index:1;}
.sgcsq-credit-animation{left:3%;bottom:1%;transform:rotate(4deg);z-index:2;}
.sgcsq-credit-art{right:3%;bottom:0;transform:rotate(-4deg);z-index:2;}

.sgcsq-title-start,.sgcsq-title-settings,.sgcsq-title-ranking{position:absolute;z-index:6;border:0;background:transparent;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;cursor:pointer;}
.sgcsq-title-start{
  left:39.75%;top:66%;width:20.5%;height:9%;display:flex;align-items:center;justify-content:center;
  border:1px solid #c79a36;border-radius:7px;background:linear-gradient(#1d5a44,#123f31);color:#fff!important;
  font-size:clamp(18px,1.33cqw,27px);font-weight:600;box-shadow:0 7px 15px rgba(55,39,20,.22),inset 0 1px rgba(255,255,255,.16);text-shadow:0 1px 2px rgba(0,0,0,.28);
}
.sgcsq-title-start:hover{filter:brightness(1.05);}
.sgcsq-title-current-label,.sgcsq-title-rule,.sgcsq-title-footer{position:absolute;z-index:5;display:flex;align-items:center;justify-content:center;text-align:center;}
.sgcsq-title-current-label{left:42.2%;top:78.2%;width:15.6%;height:2.5%;font-size:clamp(12px,.82cqw,17px);font-weight:500;white-space:nowrap;}
.sgcsq-title-current-label::before,.sgcsq-title-current-label::after{content:"";height:1px;background:#aa8127;opacity:.8;flex:1 1 auto;}
.sgcsq-title-current-label span{padding:0 .8em;}
.sgcsq-title-rule{left:31%;top:82%;width:38%;height:3%;font-size:clamp(11px,.72cqw,15px);font-weight:500;white-space:nowrap;}
.sgcsq-title-settings,.sgcsq-title-ranking{top:89.8%;height:3.2%;display:inline-flex;align-items:center;justify-content:center;gap:.42em;color:#243d32;font-weight:500;white-space:nowrap;font-size:clamp(12px,.75cqw,16px);}
.sgcsq-title-settings{left:40%;width:10.5%;}.sgcsq-title-ranking{left:50.5%;width:12.5%;}
.sgcsq-title-settings-icon,.sgcsq-title-ranking-crown{display:inline-grid;place-items:center;color:#b98b20;flex:0 0 auto;}
.sgcsq-title-settings-icon svg{width:1.05em;height:1.05em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.sgcsq-title-ranking-crown svg{width:1.15em;height:.9em;fill:currentColor;stroke:currentColor;stroke-width:1;}
.sgcsq-title-footer{right:2%;bottom:1.4%;gap:1em;color:#4d4639;font-size:clamp(9px,.56cqw,12px);white-space:nowrap;}
.sgcsq-title-footer a{color:inherit;text-decoration:none;}

/* Settings modal: the old start tabs are retained here, not discarded. */
.sgcsq-settings-overlay{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:20px;}
.sgcsq-settings-backdrop{position:absolute;inset:0;background:rgba(25,30,27,.48);backdrop-filter:blur(3px);}
.sgcsq-settings-panel{position:relative;z-index:2;width:min(92vw,590px);max-height:min(88vh,720px);overflow:auto;border:1px solid #b98b2e;border-radius:12px;background:#fffaf0 url("../images/paper-texture.webp") center/420px repeat;padding:30px 30px 27px;box-shadow:0 18px 55px rgba(25,20,13,.34);color:#263c32;text-align:center;}
.sgcsq-settings-panel::before{content:"";position:absolute;inset:7px;border:1px solid rgba(185,139,46,.28);border-radius:8px;pointer-events:none;}
.sgcsq-settings-close{position:absolute;z-index:4;right:14px;top:10px;width:36px;height:36px;border:0;background:transparent;color:#586058;font:400 30px/1 Georgia,serif;cursor:pointer;}
.sgcsq-settings-panel h3{margin:0 0 23px!important;color:#1e4938!important;font-size:28px!important;font-weight:600!important;}
.sgcsq-settings-group{margin:0 0 22px;}
.sgcsq-settings-group h4{margin:0 0 9px;color:#4a4d45;font-size:15px;font-weight:600;}
.sgcsq-settings-panel .sgcsq-tabs{margin:0;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;}
.sgcsq-settings-panel .sgcsq-tab{min-width:105px;margin:0;padding:9px 16px;border:1px solid #bca96f;border-radius:6px;background:#f2ead4;color:#3b473f;font-family:inherit;font-size:14px;}
.sgcsq-settings-panel .sgcsq-tab.is-selected{border-color:#1e5b44;background:#1e5b44;color:#fff;box-shadow:0 3px 8px rgba(26,77,59,.19);}
.sgcsq-settings-pdf{margin:4px 0 18px!important;font-size:13px;}.sgcsq-settings-pdf a{color:#396252;}
.sgcsq-settings-done{position:relative;z-index:3;min-width:210px;border:1px solid #b98b2e;border-radius:6px;background:#184c39;color:#fff;padding:11px 23px;font-family:inherit;font-size:15px;cursor:pointer;}

/* The existing game screens are centered below the series start screen. */
.sgcsq-screen-game,.sgcsq-screen-result,.sgcsq-screen-ranking{width:100%;min-height:calc(100dvh - var(--sgcsq-admin-bar-offset));padding:28px 12px 20px;margin:0!important;background:#f0f0f0;}
.sgcsq-screen-game .sgcsq-container,.sgcsq-screen-result .sgcsq-container,.sgcsq-screen-ranking .sgcsq-container{margin:0 auto;}
.sgcsq[data-screen="quiz"] .sgcsq-adtest,.sgcsq[data-screen="result"] .sgcsq-adtest,.sgcsq[data-screen="ranking"] .sgcsq-adtest{display:block;}
.sgcsq[data-screen="start"] .sgcsq-adtest{display:none;}

@media(max-width:768px){
  .sgcsq-title-header-line{left:6.2%;right:6.2%;top:6.25%;}
  .sgcsq-mobile-header{left:6.2%;right:6.2%;top:2.0%;height:3.5%;}
  .sgcsq-title-brand,.sgcsq-title-help{font-size:clamp(12px,3.3vw,16px);}
  .sgcsq-title-copy{left:5%;top:9.2%;width:90%;}
  .sgcsq-title-kicker{font-size:clamp(8px,2.2vw,11px);letter-spacing:.24em;}
  .sgcsq-title-copy h2{font-size:clamp(24px,7.2vw,36px)!important;line-height:1.22!important;letter-spacing:.01em!important;}
  .sgcsq-title-copy p{font-size:clamp(11px,3.2vw,15px);line-height:1.45;margin-top:.6em!important;}
  .sgcsq-title-mobile-break{display:block;}
  .sgcsq-title-visual{left:8%;width:84%;filter:drop-shadow(0 9px 8px rgba(74,48,21,.16));}
  .sgcsq-credit-board{left:20%;width:60%;}
  .sgcsq-credit-card{width:32%;height:43%;}
  .sgcsq-credit-board-top{font-size:clamp(7px,2vw,10px);}
  .sgcsq-credit-board-main{font-size:clamp(16px,5vw,25px);}
  .sgcsq-credit-board-small{font-size:clamp(5px,1.45vw,8px);}
  .sgcsq-credit-card span{font-size:clamp(6px,1.6vw,8px);}.sgcsq-credit-card strong{font-size:clamp(12px,3.5vw,18px);}
  .sgcsq-title-start{font-size:clamp(19px,5.2vw,27px);}
  .sgcsq-title-current-label{font-size:clamp(12px,3.3vw,16px);}
  .sgcsq-title-rule{font-size:clamp(11px,3.1vw,15px);}
  .sgcsq-title-settings,.sgcsq-title-ranking{font-size:clamp(14px,3.8vw,19px);}
  .sgcsq-title-footer{left:8%;right:8%;bottom:1.3%;font-size:clamp(9px,2.7vw,13px);gap:.7em;}
  .sgcsq-settings-panel{padding:28px 18px 23px;}
  .sgcsq-settings-panel h3{font-size:24px!important;}
  .sgcsq-settings-panel .sgcsq-tab{min-width:88px;padding:9px 11px;font-size:13px;}
}

/* Standard visible viewport. */
@media(max-width:768px){
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-copy{top:8.8%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-visual{top:25%;height:29%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-start{left:17%;top:59%;width:66%;height:7.8%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-current-label{left:23%;top:70.2%;width:54%;height:2.5%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-rule{left:7%;top:74%;width:86%;height:3%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-settings{left:8%;top:81.2%;width:40%;height:4%;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-ranking{left:48%;top:81.2%;width:44%;height:4%;}
}
/* Tall visible viewport — Pixel 7 physical-device class. */
@media(max-width:768px){
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-copy{top:8.4%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-visual{top:22.5%;height:27%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-start{left:19%;top:55%;width:62%;height:6.6%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-current-label{left:24%;top:65.3%;width:52%;height:2.3%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-rule{left:7%;top:69%;width:86%;height:2.8%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-settings{left:25%;top:76%;width:50%;height:3.6%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-ranking{left:22%;top:81%;width:56%;height:3.6%;}
}
/* Super-tall visible viewport. */
@media(max-width:768px){
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-copy{top:8.8%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-visual{top:23%;height:26%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-start{left:19%;top:56%;width:62%;height:6.5%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-current-label{left:24%;top:66.7%;width:52%;height:2.3%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-rule{left:7%;top:70.5%;width:86%;height:2.8%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-settings{left:25%;top:77.5%;width:50%;height:3.5%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-ranking{left:22%;top:82%;width:56%;height:3.5%;}
}


/* ================================================================
   v0.1.4 — Dedicated full-screen app shell
   Match the already-completed Date Quiz page architecture: the first view is
   the game itself, not a game block embedded inside the JIN article template.
   ================================================================ */
html.sgcsq-app-html{
  --sgcsq-admin-bar-offset:0px;
  margin:0!important;
  padding:0!important;
  width:100%;
  min-height:100%;
  background:#f0eee7;
}
html.sgcsq-app-html.sgcsq-admin-bar-showing{--sgcsq-admin-bar-offset:32px;}
@media(max-width:782px){
  html.sgcsq-app-html.sgcsq-admin-bar-showing{--sgcsq-admin-bar-offset:46px;}
}
body.sgcsq-app-page{
  margin:0!important;
  padding:0!important;
  width:100%;
  min-width:0;
  min-height:100%;
  background:#f0eee7;
  color:#20372e;
}
body.sgcsq-app-page *{box-sizing:border-box;}
body.sgcsq-app-page #wpadminbar{z-index:99999;}
body.sgcsq-app-page.sgcsq-state-start{
  overflow:hidden!important;
}
body.sgcsq-app-page:not(.sgcsq-state-start){
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
.sgcsq-app-main{
  position:relative;
  width:100%;
  height:calc(100dvh - var(--sgcsq-admin-bar-offset));
  min-height:0;
  margin:0;
  padding:0;
  overflow:hidden;
}
.sgcsq[data-screen="start"]{
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
}
.sgcsq .sgcsq-screen-start{
  position:relative;
  width:100%;
  height:100%;
  min-height:0;
  margin:0!important;
  padding:0;
  overflow:hidden;
}
.sgcsq-title-stage{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
  overflow:hidden;
}

/* PC vertical rhythm follows the Date Quiz master screen. */
@media(min-width:769px){
  .sgcsq-title-copy{top:10.5%;}
  .sgcsq-title-visual{left:25%;top:28.0%;width:50%;height:39%;}
  .sgcsq-title-start{left:39.6973%;top:74.9334%;width:20.5078%;height:9.3842%;}
  .sgcsq-title-current-label{left:42.2%;top:86.2%;width:15.6%;height:2.2%;}
  .sgcsq-title-rule{left:34%;top:89.8%;width:32%;height:2.2%;}
  .sgcsq-title-settings{left:40.4%;top:94.5%;width:9.8%;height:2.2%;}
  .sgcsq-title-ranking{left:47.5%;top:94.5%;width:11.8%;height:2.2%;}
  .sgcsq-title-footer{left:auto;right:1.5vw;top:96%;bottom:auto;width:auto;height:2.7%;justify-content:flex-end;text-align:right;}
}

/* PC fallback for near-square browser windows.
   Wide-PC placement above is preserved; only aspect ratios of 4:3 or narrower
   switch the two bottom actions to a center-anchored layout with a fixed gap. */
@media (min-width:769px) and (max-aspect-ratio:4/3){
  .sgcsq-title-settings{
    left:auto;
    right:calc(50% + 20px);
    width:max-content;
    white-space:nowrap;
  }
  .sgcsq-title-ranking{
    left:calc(50% + 20px);
    right:auto;
    width:max-content;
    white-space:nowrap;
  }
}

/* On mobile the stage also owns the complete visible viewport, matching the
   Date Quiz standard / tall / super-tall classification. */
@media(max-width:768px){
  .sgcsq-app-main{height:calc(100dvh - var(--sgcsq-admin-bar-offset));}
  .sgcsq-title-stage{width:100vw!important;max-width:none!important;height:100%!important;margin:0!important;}
  .sgcsq-title-footer{bottom:auto;}
  .sgcsq-title-stage[data-mobile-master="standard"] .sgcsq-title-footer{left:10%;right:auto;top:96.5%;width:80%;height:2.2%;}
  .sgcsq-title-stage[data-mobile-master="tall"] .sgcsq-title-footer{left:10%;right:auto;top:94%;width:80%;height:2.2%;}
  .sgcsq-title-stage[data-mobile-master="super-tall"] .sgcsq-title-footer{left:10%;right:auto;top:95%;width:80%;height:2.2%;}
}

/* ================================================================
   v0.1.6 — Ranking window
   Ranking is an overlay/dialog, matching the completed Date Quiz behavior.
   ================================================================ */
body.sgcsq-app-page.sgcsq-ranking-open{overflow:hidden!important;}
.sgcsq-ranking-overlay{
  position:fixed;
  inset:var(--sgcsq-admin-bar-offset,0px) 0 0;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.sgcsq-ranking-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,21,18,.54);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.sgcsq-ranking-panel{
  position:relative;
  z-index:1;
  width:min(100%,720px);
  max-height:calc(100dvh - var(--sgcsq-admin-bar-offset,0px) - 36px);
  overflow:auto;
  padding:clamp(28px,5vw,48px);
  color:#263c32;
  text-align:left;
  background:#fffaf0 url("../images/paper-texture.webp") center/420px repeat;
  border:1px solid rgba(185,139,46,.72);
  border-radius:18px;
  box-shadow:0 18px 55px rgba(25,20,13,.34);
}
.sgcsq-ranking-panel::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(185,139,46,.23);
  border-radius:13px;
  pointer-events:none;
}
.sgcsq-ranking-close{
  position:absolute;
  z-index:3;
  right:18px;
  top:16px;
  border:0;
  background:transparent;
  color:#687169;
  font-family:inherit;
  font-size:13px;
  cursor:pointer;
}
.sgcsq-ranking-kicker{
  position:relative;
  z-index:2;
  margin:0 0 6px!important;
  color:#a27825;
  font-size:11px;
  font-weight:700;
  letter-spacing:.22em;
}
.sgcsq-ranking-panel>h2{
  position:relative;
  z-index:2;
  margin:0 0 24px!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  color:#1e4938!important;
  font-family:inherit!important;
  font-size:25px!important;
  line-height:1.3!important;
  font-weight:650!important;
  letter-spacing:.02em!important;
}
.sgcsq-ranking-panel .sgcsq-ranking-tabs{
  position:relative;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:0 0 10px;
}
.sgcsq-ranking-panel .sgcsq-ranking-tab{
  flex:1 1 120px;
  min-height:44px;
  margin:0;
  padding:10px 12px;
  border:1px solid #c7b684;
  border-radius:9px;
  background:#f2ead4;
  color:#33483e;
  font-family:inherit;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}
.sgcsq-ranking-panel .sgcsq-ranking-tab.is-selected{
  border-color:#1e5b44;
  background:#1e5b44;
  color:#fff;
  box-shadow:0 3px 8px rgba(26,77,59,.19);
}
.sgcsq-ranking-panel .sgcsq-ranking-content{
  position:relative;
  z-index:2;
  min-height:160px;
  margin:20px 0 0;
  overflow-x:auto;
}
.sgcsq-ranking-panel .sgcsq-ranking-table{
  width:100%;
  border-collapse:collapse;
  background:transparent;
  font-size:13px;
}
.sgcsq-ranking-panel .sgcsq-ranking-table th,
.sgcsq-ranking-panel .sgcsq-ranking-table td{
  padding:12px 10px;
  border:0;
  border-bottom:1px solid rgba(128,113,76,.22);
  background:transparent;
  color:#33483e;
  text-align:left;
}
.sgcsq-ranking-panel .sgcsq-ranking-table th{
  color:#6b746d;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
}
.sgcsq-ranking-panel .sgcsq-ranking-table th:first-child,
.sgcsq-ranking-panel .sgcsq-ranking-table td:first-child{width:72px;text-align:center;}
.sgcsq-ranking-panel .sgcsq-ranking-table th:nth-child(2),
.sgcsq-ranking-panel .sgcsq-ranking-table td:nth-child(2){width:110px;text-align:right;font-variant-numeric:tabular-nums;}
@media(max-width:600px){
  .sgcsq-ranking-overlay{padding:12px;}
  .sgcsq-ranking-panel{
    width:100%;
    max-height:calc(100dvh - var(--sgcsq-admin-bar-offset,0px) - 24px);
    padding:30px 18px 22px;
    border-radius:14px;
  }
  .sgcsq-ranking-close{right:14px;top:12px;}
  .sgcsq-ranking-panel>h2{font-size:22px!important;}
  .sgcsq-ranking-panel .sgcsq-ranking-tab{flex:1 1 90px;min-height:42px;font-size:13px;}
}

/* ========================================================================
   v0.1.7 — Active quiz / result UI
   Align the actual five-choice game and result screen with the established
   Scene Quiz / Date Quiz visual system.  The title artwork and ranking modal
   are intentionally left unchanged.
   ======================================================================== */
html.sgcsq-app-html{
  --sgcsq-page:#f7f2e4;
  --sgcsq-surface:#fffdf7;
  --sgcsq-surface-soft:#fbf8ef;
  --sgcsq-ink:#151b18;
  --sgcsq-muted:#6f7772;
  --sgcsq-line:#dfe3de;
  --sgcsq-line-strong:#cbd2cc;
  --sgcsq-accent:#254b3f;
  --sgcsq-accent-2:#315f50;
  --sgcsq-gold:#9b7439;
  --sgcsq-danger:#a7443f;
  --sgcsq-danger-soft:#f8e9e7;
  --sgcsq-success:#255d43;
  --sgcsq-success-soft:#e7f1eb;
  --sgcsq-shadow:0 24px 70px rgba(25,36,30,.08);
}
body.sgcsq-app-page.sgcsq-state-quiz,
body.sgcsq-app-page.sgcsq-state-result{
  background:
    radial-gradient(900px 480px at 50% -180px,rgba(255,255,255,.68),rgba(255,255,255,0) 72%),
    linear-gradient(180deg,#faf6ea 0%,var(--sgcsq-page) 100%)!important;
  color:var(--sgcsq-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans CJK JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.sgcsq-app-page.sgcsq-state-quiz .sgcsq,
body.sgcsq-app-page.sgcsq-state-result .sgcsq{
  color:var(--sgcsq-ink);
  font-family:inherit;
  line-height:1.65;
}

/* ---------- Game screen ---------- */
.sgcsq .sgcsq-screen-game{
  width:100%;
  min-height:calc(100dvh - var(--sgcsq-admin-bar-offset));
  margin:0!important;
  padding:clamp(18px,4vh,42px) 20px;
  background:transparent!important;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sgcsq .sgcsq-game-shell{
  width:min(100%,840px);
  margin:0 auto;
}
.sgcsq .sgcsq-gamebar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  min-height:46px;
  padding:0 4px 10px;
  color:#59635d;
  font-size:12px;
}
.sgcsq .sgcsq-gamebar-exit{
  justify-self:start;
  border:0;
  background:transparent;
  color:#6a736e;
  padding:5px 0;
  font:inherit;
  font-weight:650;
  cursor:pointer;
}
.sgcsq .sgcsq-progress-wrap{justify-self:center;text-align:center;}
.sgcsq .sgcsq-counter{font-weight:760;letter-spacing:.03em;font-variant-numeric:tabular-nums;}
.sgcsq .sgcsq-timer{
  justify-self:end;
  color:#39423d;
  font-variant-numeric:tabular-nums;
  font-size:12px;
  font-weight:700;
}
.sgcsq .sgcsq-timer small{font-size:1em;margin-left:2px;}
.sgcsq .sgcsq-progress-line{
  height:3px;
  margin:0 2px 12px;
  background:#e0e4e0;
  border-radius:999px;
  overflow:hidden;
}
.sgcsq .sgcsq-progress-line span{
  display:block;
  width:0;
  height:100%;
  background:var(--sgcsq-accent);
  transition:width .22s ease;
}
.sgcsq .sgcsq-question-stage{width:100%;min-height:0;}
.sgcsq .sgcsq-question-card{
  position:relative;
  width:100%;
  min-height:clamp(190px,28vh,270px);
  padding:clamp(26px,4vw,42px) clamp(20px,5vw,52px);
  overflow:hidden;
  border:1px solid rgba(37,75,63,.11);
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 5%,rgba(255,255,255,.97),rgba(255,253,247,.92) 55%,rgba(247,242,228,.86) 100%),
    url("../images/paper-texture.webp") center/420px repeat;
  box-shadow:0 16px 44px rgba(25,36,30,.09);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.sgcsq .sgcsq-question-card::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(155,116,57,.17);
  border-radius:12px;
  pointer-events:none;
}
.sgcsq .sgcsq-question-kicker{
  position:relative;
  z-index:1;
  margin:0 0 14px!important;
  color:var(--sgcsq-gold);
  font-size:11px;
  font-weight:760;
  letter-spacing:.18em;
}
.sgcsq .sgcsq-question-text{
  position:relative;
  z-index:1;
  width:100%;
  max-width:720px;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  color:var(--sgcsq-ink)!important;
  font-family:inherit!important;
  font-size:clamp(23px,3.2vw,34px)!important;
  font-weight:760!important;
  line-height:1.5!important;
  letter-spacing:-.02em!important;
  text-align:center!important;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  text-wrap:balance;
}
.sgcsq .sgcsq-question-help{
  position:relative;
  z-index:1;
  max-width:680px;
  margin:16px auto 0!important;
  color:var(--sgcsq-muted);
  font-size:11px;
  line-height:1.65;
}
.sgcsq .sgcsq-answer-row{position:relative;width:100%;margin:0 auto;}
.sgcsq .sgcsq-choices{
  display:flex;
  flex-direction:column;
  gap:9px;
  width:100%;
  padding:14px 2px 22px;
}
.sgcsq .sgcsq-choice-btn{
  display:flex;
  align-items:center;
  width:100%;
  min-height:52px;
  margin:0;
  padding:12px 16px;
  border:1px solid var(--sgcsq-line);
  border-radius:12px;
  background:rgba(255,255,255,.86);
  color:var(--sgcsq-ink);
  box-shadow:0 4px 14px rgba(25,36,30,.025);
  font:inherit;
  font-size:15px;
  font-weight:680;
  line-height:1.45;
  text-align:left;
  white-space:normal;
  overflow-wrap:anywhere;
  cursor:pointer;
  transition:transform .14s ease,background .14s ease,border-color .14s ease,box-shadow .14s ease;
}
@media(hover:hover){
  .sgcsq .sgcsq-choice-btn:not(:disabled):hover{
    border-color:#abbab1;
    background:#fff;
    transform:translateY(-1px);
  }
}
.sgcsq .sgcsq-choice-btn:disabled{cursor:default;opacity:1;transform:none;}
.sgcsq .sgcsq-choice-btn.is-correct{
  background:var(--sgcsq-success-soft)!important;
  border-color:#82ad96!important;
  color:#214f3a!important;
}
.sgcsq .sgcsq-choice-btn.is-wrong{
  background:var(--sgcsq-danger-soft)!important;
  border-color:#d18c87!important;
  color:#7d2925!important;
}
.sgcsq .sgcsq-choice-btn.is-correct::before,
.sgcsq .sgcsq-choice-btn.is-wrong::before{
  display:inline-block;
  flex:0 0 auto;
  margin-right:8px;
  font-size:1.05em;
  font-weight:760;
  line-height:1;
}
.sgcsq .sgcsq-choice-btn.is-correct::before{content:"✓";}
.sgcsq .sgcsq-choice-btn.is-wrong::before{content:"×";}
.sgcsq .sgcsq-next-btn{
  margin:0 auto 18px;
  min-width:220px;
  min-height:54px;
  padding:0 18px;
  border:0;
  border-radius:12px;
  background:var(--sgcsq-accent);
  color:#fff;
  font:inherit;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
}
.sgcsq .sgcsq-next-btn:hover{background:#1f4036;}
.sgcsq .sgcsq-next-chevron{display:none;}
.sgcsq .sgcsq-next-label{display:inline;}
.sgcsq .sgcsq-swipe-hint{
  margin:8px 0 0!important;
  color:var(--sgcsq-muted);
  font-size:12px;
  text-align:center;
}

/* Button transition is revealed only after the current question is settled. */
.sgcsq .sgcsq-next-btn:not(.is-visible){display:none!important;}
.sgcsq .sgcsq-next-btn.is-visible{display:flex!important;align-items:center;justify-content:center;}
@media(min-width:769px) and (max-width:1159px){
  .sgcsq .sgcsq-next-btn.is-visible{
    position:static;
    width:min(100%,280px);
    min-width:0;
    margin:0 auto 18px;
  }
}
@media(min-width:1160px){
  .sgcsq .sgcsq-next-btn.is-visible{
    position:absolute;
    left:calc(100% + 14px);
    top:14px;
    width:56px;
    min-width:56px;
    height:calc(100% - 36px);
    min-height:0;
    margin:0;
    padding:0;
    display:grid!important;
    place-items:center;
    border-radius:14px;
  }
  .sgcsq .sgcsq-next-btn.is-visible .sgcsq-next-label{display:none;}
  .sgcsq .sgcsq-next-btn.is-visible .sgcsq-next-chevron{display:block;width:20px;height:40px;}
  .sgcsq .sgcsq-next-btn.is-visible .sgcsq-next-chevron svg{display:block;width:100%;height:100%;overflow:visible;}
  .sgcsq .sgcsq-next-btn.is-visible .sgcsq-next-chevron path{
    fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;
  }
}

/* ---------- Result screen ---------- */
.sgcsq .sgcsq-screen-result{
  width:100%;
  min-height:calc(100dvh - var(--sgcsq-admin-bar-offset));
  margin:0!important;
  padding:clamp(18px,4vh,42px) 20px;
  background:transparent!important;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sgcsq .sgcsq-result-card{
  width:min(100%,720px);
  margin:0 auto;
  padding:clamp(28px,5vw,48px);
  border:1px solid rgba(37,75,63,.10);
  border-radius:22px;
  background:rgba(255,255,255,.94);
  box-shadow:var(--sgcsq-shadow);
  text-align:center;
}
.sgcsq .sgcsq-result-kicker{
  margin:0 0 6px!important;
  color:var(--sgcsq-accent);
  font-size:11px;
  font-weight:760;
  letter-spacing:.22em;
}
.sgcsq .sgcsq-result-card>h2{
  margin:0 0 20px!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  color:var(--sgcsq-ink)!important;
  font-family:inherit!important;
  font-size:25px!important;
  font-weight:760!important;
}
.sgcsq .sgcsq-result-score{
  margin:8px 0 0;
  color:var(--sgcsq-ink);
  font-size:clamp(52px,10vw,78px);
  font-weight:800;
  line-height:1;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.04em;
}
.sgcsq .sgcsq-result-time{
  margin:10px 0 24px;
  color:var(--sgcsq-muted);
  font-size:20px;
  font-variant-numeric:tabular-nums;
}
.sgcsq .sgcsq-rank-message{
  min-height:1.5em;
  margin:0 auto 12px!important;
  color:#77551c;
  font-weight:720;
}
.sgcsq .sgcsq-registration-message{
  margin:0 auto 12px!important;
  color:#77551c;
  font-size:13px;
}
.sgcsq .sgcsq-nickname-area{
  max-width:520px;
  margin:0 auto 22px;
  padding:17px;
  border-radius:13px;
  background:#f7f8f6;
  text-align:left;
}
.sgcsq .sgcsq-nickname-area label{display:block;margin-bottom:8px;font-size:13px;font-weight:720;}
.sgcsq .sgcsq-nickname-area>div{display:flex;gap:8px;}
.sgcsq .sgcsq-nickname-area input{
  min-width:0;
  flex:1;
  padding:10px 12px;
  border:1px solid var(--sgcsq-line);
  border-radius:10px;
  background:#fff;
  color:var(--sgcsq-ink);
  font:inherit;
}
.sgcsq .sgcsq-nickname-area button{
  padding:9px 16px;
  border:0;
  border-radius:12px;
  background:var(--sgcsq-gold);
  color:#fff;
  font:inherit;
  font-weight:720;
  cursor:pointer;
}
.sgcsq .sgcsq-result-actions{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  margin-top:18px;
}
.sgcsq .sgcsq-result-primary,
.sgcsq .sgcsq-result-secondary{
  width:min(100%,380px);
  min-height:48px;
  padding:12px 16px;
  border:0;
  border-radius:12px;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
.sgcsq .sgcsq-result-primary{background:var(--sgcsq-accent);color:#fff;}
.sgcsq .sgcsq-result-primary:hover{background:#1f4036;}
.sgcsq .sgcsq-result-secondary{background:#eef1ee;color:var(--sgcsq-ink);}
.sgcsq .sgcsq-result-secondary:hover{background:#e5eae6;}

@media(max-width:768px){
  .sgcsq .sgcsq-screen-game,
  .sgcsq .sgcsq-screen-result{padding:16px 12px 24px;align-items:flex-start;}
  .sgcsq .sgcsq-game-shell{padding-top:2px;}
  .sgcsq .sgcsq-gamebar{min-height:40px;padding-bottom:8px;}
  .sgcsq .sgcsq-progress-line{margin-bottom:10px;}
  .sgcsq .sgcsq-question-card{
    min-height:160px;
    padding:24px 14px 21px;
    border-radius:14px;
  }
  .sgcsq .sgcsq-question-card::before{inset:6px;border-radius:10px;}
  .sgcsq .sgcsq-question-kicker{margin-bottom:10px!important;font-size:10px;}
  .sgcsq .sgcsq-question-text{font-size:clamp(18px,5.2vw,24px)!important;line-height:1.55!important;}
  .sgcsq .sgcsq-question-help{margin-top:12px!important;font-size:10px;line-height:1.55;}
  .sgcsq .sgcsq-choices{gap:8px;padding:11px 0 16px;}
  .sgcsq .sgcsq-choice-btn{min-height:48px;padding:11px 13px;font-size:14px;border-radius:11px;}
  .sgcsq .sgcsq-result-card{margin:auto 0;padding:26px 18px;border-radius:18px;}
  .sgcsq .sgcsq-result-card>h2{font-size:23px!important;}
  .sgcsq .sgcsq-result-time{font-size:18px;}
  .sgcsq .sgcsq-nickname-area>div{flex-direction:column;}
  .sgcsq .sgcsq-nickname-area button{min-height:42px;}
}

@media(max-width:380px){
  .sgcsq .sgcsq-screen-game{padding-left:9px;padding-right:9px;}
  .sgcsq .sgcsq-question-card{padding-left:11px;padding-right:11px;}
  .sgcsq .sgcsq-question-text{font-size:17px!important;}
  .sgcsq .sgcsq-question-help{font-size:9.5px;}
  .sgcsq .sgcsq-choice-btn{min-height:44px;padding:9px 11px;font-size:13px;}
}

/* Active screens may exceed one viewport because five long person-name choices
   must remain readable.  Scroll the app viewport instead of clipping content. */
body.sgcsq-app-page.sgcsq-state-quiz .sgcsq-app-main,
body.sgcsq-app-page.sgcsq-state-result .sgcsq-app-main{
  height:calc(100dvh - var(--sgcsq-admin-bar-offset));
  min-height:calc(100dvh - var(--sgcsq-admin-bar-offset));
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch;
}


/* ========================================================================
   0.1.9 — Shared Scene/Date Quiz sound system.
   The control lives in the title header only; no sound control is added to
   the active game HUD. Mute state is shared via sgqSoundEnabledV1.
   ======================================================================== */
.sgcsq-mobile-header-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(7px,.62cqw,13px);
  min-width:0;
}
.sgcsq-title-sound{
  display:grid;
  place-items:center;
  width:clamp(24px,1.75cqw,36px);
  height:clamp(24px,1.75cqw,36px);
  padding:0;
  margin:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#2f3e34;
  cursor:pointer;
  line-height:1;
  opacity:.92;
  transition:opacity .15s ease,background .15s ease,transform .15s ease;
}
@media(hover:hover){
  .sgcsq-title-sound:hover{background:rgba(255,255,255,.48);transform:translateY(-1px)}
}
.sgcsq-title-sound.is-muted{opacity:.58}
.sgcsq-sound-glyph{display:block;width:68%;height:68%}
.sgcsq-sound-glyph svg{display:block;width:100%;height:100%;overflow:visible}
.sgcsq-sound-glyph path{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sgcsq-speaker-body{fill:currentColor!important;stroke:none!important}
.sgcsq-speaker-muted{display:none}
.sgcsq-title-sound.is-muted .sgcsq-speaker-waves{display:none}
.sgcsq-title-sound.is-muted .sgcsq-speaker-muted{display:block}
.sgcsq-sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important
}
@media(max-width:768px){
  .sgcsq-mobile-header-right{gap:8px}
  .sgcsq-title-sound{width:30px;height:30px}
}


/* ========================================================================
   0.1.10 — SEO content below the full-screen start view.
   The game viewport remains one screen high; only the start state can scroll
   down to static explanatory and FAQ content. During play/results it is hidden.
   ======================================================================== */
body.sgcsq-app-page.sgcsq-state-start{
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
body.sgcsq-app-page:not(.sgcsq-state-start) .sgcsq-seo-content{
  display:none!important;
}
.sgcsq-seo-content{
  position:relative;
  z-index:2;
  width:100%;
  margin:0;
  padding:clamp(44px,7vw,76px) 20px clamp(60px,9vw,96px);
  background:#fffdf7;
  color:#26332e;
  border-top:1px solid rgba(77,91,82,.16);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans CJK JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  line-height:1.9;
}
.sgcsq-seo-inner{
  width:min(100%,860px);
  margin:0 auto;
}
.sgcsq-seo-content h2{
  margin:0 0 22px;
  padding:0 0 12px;
  color:#254b3f;
  font-family:"Yu Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  font-size:clamp(24px,3.2vw,34px);
  font-weight:600;
  line-height:1.45;
  border-bottom:1px solid rgba(155,116,57,.32);
}
.sgcsq-seo-content h2:not(:first-child){margin-top:54px;}
.sgcsq-seo-content p{margin:0 0 18px;font-size:15px;}
.sgcsq-seo-help-link{
  color:#254b3f!important;
  font-weight:700;
  text-decoration:underline!important;
  text-underline-offset:4px;
}
.sgcsq-seo-faq{
  display:grid;
  gap:0;
  border-top:1px solid rgba(77,91,82,.13);
}
.sgcsq-seo-faq-item{
  padding:22px 0 20px;
  border-bottom:1px solid rgba(77,91,82,.13);
}
.sgcsq-seo-faq-item h3{
  margin:0 0 9px;
  color:#263b31;
  font-size:17px;
  font-weight:750;
  line-height:1.6;
}
.sgcsq-seo-faq-item p{margin:0;color:#4d5752;}
@media(max-width:768px){
  .sgcsq-seo-content{padding:38px 20px 64px;}
  .sgcsq-seo-content h2{font-size:24px;margin-bottom:18px;}
  .sgcsq-seo-content h2:not(:first-child){margin-top:44px;}
  .sgcsq-seo-content p{font-size:14px;line-height:1.9;}
  .sgcsq-seo-faq-item{padding:19px 0 17px;}
  .sgcsq-seo-faq-item h3{font-size:16px;}
}


/* ========================================================================
   0.1.12 — AdSense parity with Scene Quiz / Date Quiz.
   Mobile: responsive slot 3327093842 at the bottom of the active quiz.
   Desktop: 300x250 slot 8269044239 only when >=348px of real right space
   exists beside the question stage (48px gap + 300px ad width).
   ======================================================================== */
.sgcsq .sgcsq-mobile-quiz-ad,
.sgcsq .sgcsq-pc-quiz-ad{
  display:none!important;
}

@media(max-width:768px){
  .sgcsq .sgcsq-mobile-quiz-ad{
    display:block!important;
    position:relative!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:18px 0 calc(24px + env(safe-area-inset-bottom, 0px))!important;
    padding:0!important;
    text-align:center!important;
    overflow:hidden!important;
    contain:layout paint inline-size!important;
  }
  .sgcsq .sgcsq-mobile-quiz-ad-label{
    margin:0 0 7px!important;
    padding:0!important;
    color:rgba(34,43,38,.48)!important;
    font-size:10px!important;
    font-weight:400!important;
    line-height:1.3!important;
    letter-spacing:.05em!important;
    text-align:center!important;
  }
  .sgcsq .sgcsq-mobile-quiz-ad .adsbygoogle{
    display:block!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
    overflow:hidden!important;
  }
  .sgcsq .sgcsq-mobile-quiz-ad iframe{
    max-width:100%!important;
  }
}

@media(min-width:769px){
  .sgcsq .sgcsq-screen-game{
    overflow:visible!important;
  }
  .sgcsq .sgcsq-question-stage{
    position:relative!important;
    overflow:visible!important;
  }
  .sgcsq .sgcsq-pc-quiz-ad.is-visible{
    display:block!important;
    position:absolute!important;
    left:calc(100% + 48px)!important;
    top:0!important;
    width:300px!important;
    min-width:300px!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    z-index:3!important;
    contain:none!important;
    overflow:visible!important;
  }
  .sgcsq .sgcsq-pc-quiz-ad-label{
    margin:0 0 8px!important;
    padding:0!important;
    color:rgba(34,43,38,.44)!important;
    font-size:11px!important;
    font-weight:400!important;
    line-height:1.3!important;
    letter-spacing:.05em!important;
    text-align:center!important;
  }
  .sgcsq .sgcsq-pc-quiz-ad .adsbygoogle{
    display:inline-block!important;
    width:300px!important;
    height:250px!important;
    margin:0 auto!important;
    vertical-align:top!important;
  }
  .sgcsq .sgcsq-pc-quiz-ad-slot{
    display:block!important;
    width:300px!important;
    min-width:300px!important;
    max-width:300px!important;
    height:250px!important;
    min-height:250px!important;
    max-height:250px!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:visible!important;
  }
  .sgcsq .sgcsq-pc-quiz-ad-slot > ins.adsbygoogle{
    display:inline-block!important;
    width:300px!important;
    min-width:300px!important;
    max-width:300px!important;
    height:250px!important;
    min-height:250px!important;
    max-height:250px!important;
    margin:0!important;
    padding:0!important;
  }
}

/* v0.1.16 — narrow-screen question guidance: Japanese inter-character justification. */
@media (max-width:640px){
  .sgcsq .sgcsq-question-help{
    max-width:none;
    text-align:justify!important;
    text-justify:inter-character;
    text-align-last:left;
  }
}