.omk-app{--ink:#2b211b;--verm:#9f2f28;--gold:#b8914d;--paper:#f3ead3;--wood:#6f452a;position:relative;max-width:980px;margin:0 auto;color:var(--ink);font-family:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;background:radial-gradient(circle at 50% 0,rgba(255,249,230,.93),rgba(231,218,187,.82) 52%,rgba(119,82,51,.17)),repeating-linear-gradient(90deg,rgba(94,55,29,.06) 0 1px,transparent 1px 13px);border:1px solid rgba(100,69,38,.26);box-shadow:0 24px 70px rgba(21,14,10,.22);overflow:hidden}
.omk-app:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E")}
.omk-head{position:relative;display:flex;justify-content:space-between;align-items:center;padding:22px 28px;border-bottom:1px solid rgba(78,49,31,.25);background:rgba(250,244,225,.55)}.omk-brand{display:flex;align-items:center;gap:12px}.omk-brand h2,.omk-brand small{margin:0}.omk-brand h2{font-size:1.7rem;letter-spacing:.22em}.omk-brand small{color:#765f47;letter-spacing:.18em}.omk-kamon{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--verm);border-radius:50%;color:var(--verm);font-size:1.4rem}.omk-tools,.omk-langs{display:flex;align-items:center;gap:7px}.omk-langs button,.omk-icon{border:0;background:transparent;color:#4f4036;padding:7px 9px;font-family:inherit;cursor:pointer}.omk-langs button.active{color:var(--verm);border-bottom:1px solid var(--verm)}.omk-icon{font-size:1.05rem}
.omk-progress{position:relative;display:flex;justify-content:center;gap:26px;padding:17px}.omk-progress:before{content:"";position:absolute;top:22px;width:245px;border-top:1px solid rgba(114,74,43,.25)}.omk-progress i{z-index:1;width:10px;height:10px;border-radius:50%;background:#c6b393;border:3px solid #eadfc5;box-sizing:content-box}.omk-progress i.active{background:var(--verm)}
.omk-scene{position:relative}.omk-panel{display:none;min-height:590px;padding:28px 6%;box-sizing:border-box;text-align:center}.omk-panel.active{display:flex;flex-direction:column;align-items:center;justify-content:center;animation:omkFade .7s ease both}@keyframes omkFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.omk-lead{font-size:1.14rem;letter-spacing:.08em}.omk-hint{color:#705e50}.omk-temple{position:absolute;inset:30px 0 auto;height:210px;opacity:.13;pointer-events:none}.omk-temple span{position:absolute;left:14%;right:14%;top:50px;height:24px;background:#2c1910;clip-path:polygon(0 70%,45% 0,55% 0,100% 70%,91% 100%,9% 100%)}.omk-temple i{position:absolute;left:23%;right:23%;top:90px;height:16px;background:#2c1910;clip-path:polygon(0 80%,44% 0,56% 0,100% 80%,90% 100%,10% 100%)}.omk-temple b{position:absolute;left:47%;top:105px;width:6%;height:105px;background:#2c1910}
.omk-cylinder-wrap{position:relative;width:260px;height:350px;margin:18px auto 5px;touch-action:none}.omk-cylinder{position:absolute;left:50%;bottom:18px;width:145px;height:260px;transform:translateX(-50%);border-radius:12px 12px 25px 25px;background:linear-gradient(90deg,#432416,#8b5633 18%,#a86e43 50%,#704126 82%,#351e15);box-shadow:inset 10px 0 18px rgba(255,232,181,.12),inset -12px 0 20px rgba(0,0,0,.25),0 22px 28px rgba(44,25,15,.3);cursor:grab;user-select:none}.omk-cylinder:active{cursor:grabbing}.omk-rim{position:absolute;left:-8px;right:-8px;top:-15px;height:30px;border-radius:50%;background:radial-gradient(ellipse,#21130d 0 46%,#704226 48% 65%,#2f1b12 68%);box-shadow:0 3px 5px #24140e}.omk-sticks{position:absolute;left:22px;right:22px;top:-72px;height:78px;overflow:hidden}.omk-sticks i{position:absolute;bottom:-5px;width:8px;height:84px;background:linear-gradient(90deg,#b98a53,#e0bb79,#a06b38);border-radius:3px;transform-origin:bottom}.omk-sticks i:nth-child(1){left:8px;transform:rotate(-6deg)}.omk-sticks i:nth-child(2){left:30px;transform:rotate(3deg)}.omk-sticks i:nth-child(3){left:50px;transform:rotate(-2deg)}.omk-sticks i:nth-child(4){right:26px;transform:rotate(5deg)}.omk-sticks i:nth-child(5){right:5px;transform:rotate(-4deg)}.omk-mark{position:absolute;inset:45px 43px;background:rgba(230,214,171,.92);border:1px solid #342017;color:#352014;font-size:1.8rem;line-height:1.75;padding-top:9px;box-shadow:inset 0 0 0 4px rgba(112,64,35,.18)}.omk-hole{position:absolute;left:50%;bottom:10px;width:23px;height:9px;transform:translateX(-50%);background:#160d09;border-radius:50%}.omk-cylinder.shaking{animation:omkShake .18s linear infinite}@keyframes omkShake{0%,100%{transform:translateX(-50%) rotate(-3deg)}50%{transform:translateX(-50%) rotate(4deg)}}.omk-drawn-stick{position:absolute;left:50%;bottom:24px;width:10px;height:180px;opacity:0;transform:translate(-50%,-115px) rotate(5deg);background:linear-gradient(90deg,#a9773e,#e1bb77,#9a6534);border-radius:4px;box-shadow:0 8px 8px rgba(0,0,0,.2)}.omk-drawn-stick.drawn{animation:omkDrop 1.2s cubic-bezier(.2,.7,.3,1) forwards}@keyframes omkDrop{0%{opacity:1;transform:translate(-50%,-115px)}65%{opacity:1;transform:translate(70px,80px) rotate(68deg)}100%{opacity:1;transform:translate(78px,116px) rotate(79deg)}}.omk-meter{width:210px;height:3px;background:rgba(96,61,37,.18)}.omk-meter span{display:block;height:100%;width:0;background:var(--verm);transition:width .1s}
.omk-stick-large{width:26px;height:270px;background:linear-gradient(90deg,#a87439,#e1bd78,#98602c);box-shadow:3px 8px 12px rgba(48,28,16,.26);display:flex;align-items:flex-end;justify-content:center;padding-bottom:23px}.omk-stick-large span{writing-mode:vertical-rl;font-size:1.25rem}.omk-number h3{font-size:2rem;letter-spacing:.2em}.omk-seal-btn,.omk-actions button{border:1px solid #7c2923;background:var(--verm);color:#f7ecd5;padding:12px 24px;font-family:inherit;letter-spacing:.08em;cursor:pointer;box-shadow:0 5px 0 #6c261f}.omk-scene-heading{width:100%;display:flex;justify-content:space-between;align-items:end;text-align:left}.omk-scene-heading strong{display:block;font-size:1.5rem}.omk-feedback{min-height:30px;color:var(--verm);padding:8px}.omk-cabinet{width:100%;display:grid;grid-template-columns:repeat(10,1fr);gap:7px;padding:18px;background:linear-gradient(135deg,#3f2417,#765035 45%,#3c2317);border:9px solid #3a2014;box-shadow:inset 0 0 25px #1f110b,0 18px 36px rgba(33,20,13,.27);box-sizing:border-box}.omk-drawer{aspect-ratio:1.35;border:1px solid #3c2417;background:linear-gradient(#9c6b43,#714729);color:#ead9b7;box-shadow:inset 0 2px 4px rgba(255,237,198,.2),0 2px 2px #24150e;cursor:pointer;font-family:inherit}.omk-drawer:hover,.omk-drawer:focus{filter:brightness(1.18);transform:translateY(-2px)}.omk-drawer.wrong{animation:omkWrong .35s}@keyframes omkWrong{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.omk-drawer-box{position:relative;width:min(520px,86vw);height:310px;perspective:900px;background:linear-gradient(#50301e,#2e1a11);border:12px solid #392116;box-shadow:0 26px 45px rgba(32,18,11,.35)}.omk-drawer-face{position:absolute;left:3%;right:3%;top:10%;height:58%;background:linear-gradient(100deg,#885634,#aa7549,#6d4229);transform:translateZ(0);box-shadow:0 8px 14px rgba(0,0,0,.3);animation:drawerOpen 1.2s ease forwards}.omk-drawer-face b{display:block;margin:60px auto 0;width:70px;padding:8px;border:1px solid #332017;background:#b88a55}.omk-drawer-face i{display:block;margin:18px auto;width:42px;height:10px;border:5px solid #332017;border-top:0;border-radius:0 0 12px 12px}@keyframes drawerOpen{to{transform:translateY(145px) translateZ(90px)}}.omk-drawer-inside{position:absolute;left:11%;right:11%;top:22%;height:43%;background:#24150e;overflow:hidden}.omk-paper-folded{position:absolute;left:50%;top:26px;width:72%;height:68px;transform:translateX(-50%);background:#eee2c7;border:0;box-shadow:0 3px 8px #000;cursor:pointer}.omk-paper-folded span{color:#4a3021;font-family:inherit;letter-spacing:.35em}.omk-unfold{display:flex;width:min(420px,78vw);height:360px;perspective:900px}.omk-unfold i{flex:1;background:var(--paper);border-left:1px solid rgba(81,58,40,.15);transform:rotateY(88deg);animation:unfold 1.45s ease forwards}.omk-unfold i:nth-child(2){animation-delay:.3s}.omk-unfold i:nth-child(3){animation-delay:.6s}@keyframes unfold{to{transform:rotateY(0)}}
.omk-result-scene{padding-top:18px}.omk-slip{width:min(620px,92%);padding:32px 8%;box-sizing:border-box;text-align:left;background:linear-gradient(95deg,rgba(255,255,255,.15),transparent),var(--paper);border:1px solid #cbbb98;box-shadow:0 20px 40px rgba(40,26,16,.25);position:relative}.omk-slip:before{content:"";position:absolute;inset:7px;border:1px solid rgba(105,72,43,.23);pointer-events:none}.omk-slip header{text-align:center;border-bottom:2px solid var(--verm);padding-bottom:18px}.omk-slip header span,.omk-slip header b{display:block;letter-spacing:.22em}.omk-slip header strong{display:block;margin-top:12px;color:var(--verm);font-size:2.2rem}.omk-poem{text-align:center;padding:24px}.omk-poem p{white-space:pre-line;font-size:1.35rem;line-height:1.9;letter-spacing:.12em}.omk-slip hr{border:0;border-top:1px solid #a99672}.omk-slip h4{letter-spacing:.18em}.omk-slip footer{margin-top:22px;padding-top:14px;border-top:1px solid #c9b997;font-size:.86rem;color:#6f604f}.omk-categories{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}.omk-cat{border-bottom:1px dotted #b4a27f;padding:6px}.omk-cat b{display:block;color:#7e322a}.omk-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:25px}.omk-actions .omk-ghost{background:transparent;color:#633c29;box-shadow:none;border-color:#947153}
.omk-after{padding:24px 6% 40px;display:grid;grid-template-columns:1fr 1fr;gap:22px}.omk-rack-card,.omk-history{padding:18px;background:rgba(248,238,213,.55);border:1px solid rgba(87,56,35,.25)}.omk-rack{min-height:112px;border-top:8px solid #654027;border-bottom:8px solid #654027;display:flex;align-items:center;gap:2px;padding:0 12px;overflow:hidden}.omk-tied{width:13px;height:75px;background:#eee4cc;transform:rotate(var(--r));box-shadow:0 1px 3px rgba(0,0,0,.18)}.omk-history summary{cursor:pointer;font-size:1.08rem}.omk-history-row{display:grid;grid-template-columns:1fr auto auto;gap:9px;padding:9px 0;border-bottom:1px dotted #b8a686}.omk-history-row button,.omk-text-btn{border:0;background:transparent;color:var(--verm);cursor:pointer}.omk-source{position:relative;padding:0 6% 28px;font-size:.75rem;color:#786957}.omk-source a{color:#7e4634}
@media(max-width:720px){.omk-head{padding:16px;align-items:flex-start}.omk-brand h2{font-size:1.25rem}.omk-kamon{width:38px;height:38px}.omk-tools{align-items:flex-end;flex-direction:column}.omk-panel{min-height:540px;padding:22px 4%}.omk-cabinet{grid-template-columns:repeat(5,1fr);gap:6px;padding:10px}.omk-drawer{min-height:38px}.omk-scene-heading{display:block;text-align:center}.omk-after{grid-template-columns:1fr}.omk-categories{grid-template-columns:1fr}.omk-slip{padding:28px 9%}.omk-poem{padding:18px 4%}}
@media(prefers-reduced-motion:reduce){.omk-app *{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.omk-scene,
.omk-panel {
  color: #f2e7cf;
}

.omk-lead,
.omk-number > p,
.omk-number h3,
.omk-drawer-scene > p,
.omk-unfold-scene > p,
.omk-scene-heading,
.omk-scene-heading strong,
.omk-scene-heading small,
.omk-scene-heading p {
  color: #fff3d8;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.72);
}

.omk-hint {
  color: #ddc8a6;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.72);
}

.omk-feedback {
  color: #ffb0a8;
}

.omk-slip,
.omk-after {
  color: var(--ink);
  text-shadow: none;
}

.omk-cabinet {
  grid-template-columns: repeat(10, minmax(0, 1fr));
  max-width: 100%;
  overflow: hidden;
}

.omk-drawer {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-inline: 2px;
}

@media (max-width: 720px) {
  .omk-cabinet {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* Closed Asakusa-style fortune cylinder: only the small top opening is visible. */
.omk-cylinder {
  bottom: 22px;
  width: 150px;
  height: 265px;
  border-radius: 7px 7px 20px 20px;
  background:
    linear-gradient(90deg, rgba(22, 10, 6, .45), transparent 18% 78%, rgba(20, 9, 5, .5)),
    linear-gradient(90deg, #3a1d12, #8d5632 24%, #a66b40 51%, #724126 79%, #32190f);
  clip-path: polygon(7% 0, 93% 0, 100% 6%, 94% 96%, 85% 100%, 15% 100%, 6% 96%, 0 6%);
  overflow: visible;
  z-index: 2;
}

.omk-rim {
  left: 7px;
  right: 7px;
  top: -10px;
  height: 27px;
  border: 2px solid #2b160e;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, #805033 0 58%, #4a2818 61% 78%, #25130c 81%);
  box-shadow: inset 0 3px 5px rgba(240, 190, 120, .22), 0 4px 7px rgba(0, 0, 0, .45);
  z-index: 4;
}

.omk-top-hole {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 17px;
  height: 8px;
  transform: translate(-50%, -50%);
  border: 1px solid #160b07;
  border-radius: 50%;
  background: #0d0705;
  box-shadow: inset 0 1px 3px #000, 0 1px rgba(218, 151, 91, .25);
}

.omk-mark {
  inset: 43px 43px 42px;
}

.omk-drawn-stick {
  left: 50%;
  top: 45px;
  bottom: auto;
  width: 9px;
  height: 190px;
  z-index: 1;
  transform-origin: 50% 100%;
  transform: translate(-50%, 120px);
}

.omk-drawn-stick.drawn {
  animation: omkEmergeFromHole .75s cubic-bezier(.2, .72, .28, 1) forwards;
}

@keyframes omkEmergeFromHole {
  0% { opacity: 0; transform: translate(-50%, 132px) rotate(0deg); }
  15% { opacity: 1; }
  75% { opacity: 1; transform: translate(-50%, -13px) rotate(-2deg); }
  100% { opacity: 1; transform: translate(-50%, -8px) rotate(1deg); }
}

.omk-drawn-stick.drawn:not(.extracted) {
  cursor: grab;
  touch-action: none;
  transform: translate(-50%, calc(-8px - var(--pull, 0px))) rotate(1deg);
}

.omk-drawn-stick.pulling {
  animation: none;
  cursor: grabbing;
  transition: none;
}

.omk-drawn-stick.extracted {
  animation: omkExtractStick .52s ease-out forwards;
  pointer-events: none;
}

@keyframes omkExtractStick {
  from { opacity: 1; transform: translate(-50%, -86px) rotate(1deg); }
  to { opacity: 1; transform: translate(-50%, -190px) rotate(-4deg); }
}

.omk-pull-hint {
  display: none;
  margin: 2px 0 8px;
  color: #fff3d8;
  font-weight: 600;
  letter-spacing: .08em;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .72);
}

.omk-app.awaiting-pull .omk-pull-hint {
  display: block;
  animation: omkFade .45s ease both;
}

.omk-app.awaiting-pull .omk-hint,
.omk-app.awaiting-pull .omk-meter {
  opacity: .35;
}

.omk-title {
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: .22em;
}

.omk-number-label {
  margin: 1em 0;
  color: #fff3d8;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .72);
}

.omk-reading-title,
.omk-rack-title {
  margin: 1em 0;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: .18em;
}

.omk-line-cue {
  display: block;
  margin-top: 4px;
  color: #776550;
  font-size: .76rem;
  line-height: 1.45;
}
