/* Preliminary Bookworm palette/type/material pass. Layout and original scene
   art stay unchanged; a full panel/frame redesign awaits visual references. */
@font-face{
  font-family:'Pirata One';font-style:normal;font-weight:400;font-display:swap;
  src:url('/lab/7/fonts/pirata-one.ttf') format('truetype');
}
.bookworm-theme,
.bookworm-theme .wb,
.bookworm-theme .wb[data-scene-lighting] .wb-scene,
.bookworm-theme .wb.desk[data-scene-lighting] .wb-tray,
.bookworm-theme .wb.desk[data-scene-lighting] .wb-verdict{
  --bg:#120c09;--paper:#21140e;--text:#f5e9d8;--accent:#f3d47f;--border:#b68b3d;
  --cut-floor:#2b1a12;--cut-top:#483021;--cut-left:#483021;--cut-right:#483021;--cut-bottom:#483021;--cut-shade:#0005;
  --sill-top:#39251a;--sill-arris:#65452a;--sill-front:#28170e;--sill-front-dk:#110b07;
  --engrave-hi:transparent;--danger-red:#ff7770;
  --shadow:#0006;--line:#6b4a2b;
  --gem-amethyst:#773ab1;--gem-emerald:#1b9d57;--gem-sapphire:#286ac4;
  --gem-garnet:#b02650;--gem-ruby:#c73939;--gem-crystal:#57a9bf;--gem-diamond:#91bbcc;
}
.bookworm-theme{
  background:#120c09;color:var(--text);font-family:'EB Garamond',Georgia,serif;
  --timber-grain:repeating-linear-gradient(93deg,#e8bd6a04 0 1px,transparent 1px 7px),repeating-linear-gradient(3deg,#0003 0 1px,transparent 1px 5px),radial-gradient(ellipse at 25% 0,#6a402018,transparent 70%);
  background-image:var(--timber-grain);
  --display-font:'Pirata One',Georgia,serif;
  --gold-face:#e8c46a;
  --gold-relief:0 -1px 0 #fff0ac,0 1px 0 #986521,0 2px 0 #624016,0 3px 2px #100a06;
}
.bookworm-theme .wb :is(.carved,.wb-mobile-sheet,.wb-end-card,.wb-readout){
  background-color:var(--paper);border-color:#513522;box-shadow:none;
}
.bookworm-theme .wb.desk .wb-tray{background:none;border:0;box-shadow:none;}
.bookworm-theme .wb :is(.wb-lore p,.wb-tactics li,.wb-socket p,.wb-chapter-story,.wb-sheet-scroll,.wb-audio-dialog){color:var(--text);}
.bookworm-theme .wb :is(.wb-panel-title,.wb-relic-panel h2,.wb-lore summary,.wb-tactics > summary){color:var(--accent);opacity:1;}
.bookworm-theme .wb .engraved{text-shadow:none;}
.bookworm-theme .wb :is(.jacquard,.wb-title-main,.wb-socket-name,.wb-utility-tiles button,.wb-panel h2,.wb-chapter-story h2,.wb-chapter-story button,.wb-audio-dialog h2,.wb-speech strong){
  font-family:var(--display-font);font-weight:400;letter-spacing:.025em;
}
.bookworm-theme .wb :is(.wb-utility-tiles button,.wb-panel h2){text-transform:none;}
.bookworm-theme .wb .wb-utility-tiles button{font-size:1.05rem;}
.bookworm-theme .wb .wb-relic-panel h2{font-size:1.15rem;line-height:1.2;text-transform:none;letter-spacing:.03em;}
.bookworm-theme .game-site-identity h1,
.bookworm-theme .wb .wb-mobile-header > span,
.bookworm-theme .wb .wb-scene .wb-who .wb-name{
  font-family:var(--display-font);font-weight:400;font-style:normal;
  color:var(--gold-face);background:none;-webkit-text-fill-color:currentColor;
  text-shadow:var(--gold-relief);filter:none;
}
.bookworm-theme .game-site-identity h1{font-size:48px;line-height:1;}
.bookworm-theme .wb .wb-modes,
.bookworm-theme .wb #wb-mobile-mode{display:none!important;}
.bookworm-theme .wb.desk .wb-title{grid-column:2;}
.bookworm-theme .wb.desk .wb-meta{grid-column:3;}
.bookworm-theme .wb .wb-mobile-back{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;
  padding:0 8px;border:1px solid var(--border);color:var(--accent);
  background:var(--paper);font-size:.95rem;line-height:1;text-decoration:none;white-space:nowrap;
}
.bookworm-theme .wb .wb-mobile-back:focus-visible{outline:2px solid #ffe49b;outline-offset:2px;}
.bookworm-theme .wb .wb-scene .wb-who .wb-name{font-size:1.65rem;line-height:1.2;}
/* One material and top-lit, hard-edged relief for the entire combat readout. */
.bookworm-theme .wb .wb-scene .wb-who .wb-hearts{
  font-family:var(--display-font);font-weight:400;font-style:normal;
  color:var(--gold-face);opacity:1;text-shadow:var(--gold-relief);
}
.bookworm-theme .wb .wb-scene .wb-meter{
  --pip-color:var(--gold-face);filter:none;
}
.bookworm-theme .wb .wb-scene .wb-health-pip{
  position:relative;background:#49341d;box-shadow:none;
  filter:drop-shadow(0 -1px 0 #fff0ac) drop-shadow(0 1px 0 #986521) drop-shadow(0 2px 0 #624016) drop-shadow(0 3px 2px #100a06);
}
.bookworm-theme .wb .wb-scene .wb-health-pip::before{
  content:"";position:absolute;inset:0;
  background:conic-gradient(from 0deg at 50% 50%,transparent 0 var(--lost,0%),var(--gold-face) var(--lost,0%) 100%);
}
/* DOM pips fill from Lex's left / the foe's right. Mirror only the pie face,
   not its lighting: the first lost quarter faces inward on both combatants. */
.bookworm-theme .wb .wb-scene .wb-you .wb-meter{direction:ltr;}
.bookworm-theme .wb .wb-scene .wb-foe .wb-meter{direction:rtl;}
.bookworm-theme .wb .wb-scene .wb-foe .wb-health-pip::before{transform:scaleX(-1);}
.bookworm-theme .wb :is(.wb-meta,.game-best-label,.wb-title-sub){color:var(--accent);opacity:1;}
.bookworm-theme .wb .game-best-score{color:#ffe49b;opacity:1;text-shadow:0 1px 1px #000;}
.bookworm-theme .future-return{background:var(--paper);color:var(--text);border-color:var(--border);}
.bookworm-theme .future-return,
.bookworm-theme .wb :is(button:not(.wb-tile),a,dialog,.carved,.wb-mobile-sheet,.wb-end-card,.wb-readout,.wb-speech,.wb-tip,.wb-socket){border-radius:0;}
.bookworm-theme .future-return,
.bookworm-theme .wb .wb-utility-tiles .wb-buffs-launch,
.bookworm-theme .wb :is(.wb-mobile-tools button,.wb-utility-tiles button,.wb-mobile-back){
  font-family:var(--display-font);font-weight:400;font-style:normal;font-size:1.05rem;
}
.bookworm-theme .wb .wb-bars{background:var(--paper);border-color:var(--border);}
.bookworm-theme .wb.desk .wb-bars{background:none;}
.bookworm-theme .wb :is(.wb-mobile-tools button,.wb-utility-tiles button,#wb-scramble,#wb-audio-mute){
  background:var(--paper);color:var(--accent);border-color:var(--border);box-shadow:none;
}
.bookworm-theme .wb .wb-mobile-tools button[aria-pressed="true"]{background:#452d1b;border-color:var(--accent);}
.bookworm-theme .wb .wb-speech{background:var(--paper);color:var(--text);border-color:var(--border);}
.bookworm-theme .wb .wb-speech::after{border-top-color:var(--paper);}
.bookworm-theme .wb .wb-relics{
  flex:0 0 auto;min-height:min-content;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));
  gap:18px 8px;padding:12px 4px 18px;align-items:start;
}
.bookworm-theme .wb .wb-socket{gap:10px;padding:0;}
.bookworm-theme .wb .wb-socket-n{
  position:relative;flex:none;width:112px;height:156px;min-width:112px;min-height:156px;
  max-width:none;aspect-ratio:auto;padding:18px 17px;border:0;
  background:radial-gradient(ellipse at center,#342216,#100a06 80%);
  box-shadow:0 3px 7px #0009;
}
.bookworm-theme .wb .wb-socket-n::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:url('/lab/7/relic-frame.svg') center / 100% 100% no-repeat;
}
.bookworm-theme .wb .wb-socket-n::after{display:none;}
.bookworm-theme .wb .wb-socket-n .wb-relic-art{width:100%;height:100%;max-width:none;object-fit:contain;}
.bookworm-theme .wb.desk .wb-relic-panel{overflow:auto;scrollbar-width:thin;scrollbar-color:#b89245 #160e09;}
@media(max-width:640px) and (orientation:portrait){
  .bookworm-theme .wb .wb-relics{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));}
  .bookworm-theme .wb .wb-socket-n{width:100px;height:140px;min-width:100px;min-height:140px;padding:16px 15px;}
}
.bookworm-theme .wb .wb-socket.empty :is(.wb-socket-name,p){display:none;}

/* A narrow gilt picture frame: bright outer lip, dark bevel, inner gold edge.
   Keep existing panel geometry and reserve the artwork for the original scenes. */
.bookworm-theme .wb :is(.carved,.wb-mobile-sheet,.wb-end-card,.wb-readout){
  background-color:var(--paper);background-image:var(--timber-grain);
  border-color:#e0bb68 #886023 #886023 #cda44f;
  box-shadow:inset 0 0 0 1px #442b13,inset 0 0 0 2px #bc9144,0 1px 3px #0008;
}
.bookworm-theme .wb.desk .wb-tray{background:none;border:0;box-shadow:none;}
.bookworm-theme .wb .wb-tray{overflow:visible;}
.bookworm-theme .wb .wb-tray .wb-tile{z-index:10;transition:none;}
.bookworm-theme .wb .wb-tray .wb-tile:hover{transform:none;}

.bookworm-theme .wb .wb-path{
  display:block;position:relative;width:clamp(80px,9vw,160px);height:10px;
  padding:1px;margin:0;overflow:hidden;border:1px solid #cba454;
  background:#100b07;box-shadow:0 1px 0 #f4d78044;
}
.bookworm-theme .wb .wb-path:empty{display:none;}
.bookworm-theme .wb .wb-path > span{
  display:block;height:100%;width:var(--progress,0%);background:#e5be63;
  box-shadow:inset 0 1px 0 #fff1ba,inset 0 -1px 0 #906221;transition:width .4s ease;
}
@media(max-width:640px) and (orientation:portrait){
  .bookworm-theme .wb .wb-board{grid-template-rows:40px 24px minmax(0,1fr) 44px;}
  .bookworm-theme .wb .wb-board > .wb-tray{height:40px;min-height:40px;margin:0;padding:3px;width:100%;}
  .bookworm-theme .wb .wb-fight > .wb-mobile-progress{flex:none;order:-1;width:100%;height:24px;margin:0 0 5px;}
  .bookworm-theme .wb .wb-mobile-tools button{border-radius:0;}
  .bookworm-theme .wb-mobile-progress{position:relative;padding-bottom:4px;line-height:16px;}
  .bookworm-theme .wb-mobile-progress::after{
    content:"";position:absolute;bottom:0;left:25%;width:50%;height:3px;
    background:linear-gradient(to right,#edca73 var(--progress,0%),#483319 var(--progress,0%));
  }
}
@media(prefers-reduced-motion:reduce){.bookworm-theme .wb .wb-path > span{transition:none;}}

/* Preserve the established tile face, serif lettering and contrast. */
.bookworm-theme .wb-tile{
  --sill-top:#efe3c8;--sill-arris:#fbf5e7;--sill-front:#d6c3a0;--sill-front-dk:#a58b56;
  --accent:#3d2a10;--engrave-hi:#fff8df;--tile-shade:#0005;
  font-family:'EB Garamond',Georgia,serif;
  touch-action:manipulation;-webkit-user-select:none;user-select:none;
}
@media(hover:none),(pointer:coarse){
  .bookworm-theme .wb .wb-tile:hover,.bookworm-theme .wb .wb-tile:active{transform:none;}
}
.bookworm-theme .wb .wb-actions button{touch-action:manipulation;}
/* Keep the native gesture target on the stable button, not on letter/facet
   children that are replaced when the rack or word preview is rendered. */
.bookworm-theme .wb .wb-tile *,
.bookworm-theme .wb .wb-actions button *{pointer-events:none;}

/* Connected facet meshes: centered step rings, princess triangles or cushion
   panels. Only the light orientation changes; never the table's alignment. */
.bookworm-theme .wb-tile.gem,
.bookworm-theme .wb .wb-actions #wb-attack{
  --jewel:var(--gem,#269e42);position:relative;isolation:isolate;
  border:0;border-radius:0;color:#ffe79a;
  --facet-surface:linear-gradient(145deg,color-mix(in srgb,var(--jewel) 85%,#fff),var(--jewel) 42%,color-mix(in srgb,var(--jewel) 80%,#000));
  background:var(--facet-surface);
  box-shadow:inset 0 1px 1px #fff8,inset 0 -2px 3px #0009;
}
.bookworm-theme .wb-tile.gem::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
  background:var(--facet-art,url('/lab/7/facets/emerald.svg')) center / 100% 100% no-repeat;
  transform:rotate(var(--facet-rotation,0deg));
}
.bookworm-theme .wb-tile.gem::after{display:none;}
.bookworm-theme .wb-tile.gem .wb-gem-glint{
  display:block;z-index:1;inset:0;transform:rotate(var(--facet-rotation,0deg));
}
.bookworm-theme .wb-tile.gem .wb-gem-glint::before,
.bookworm-theme .wb-tile.gem .wb-gem-glint::after{display:none;animation:none;}
.bookworm-theme .wb-facet-lights{display:block;width:100%;height:100%;overflow:visible;pointer-events:none;}
.bookworm-theme .wb-facet-lights polygon{fill:#effff7;opacity:0;}
.bookworm-theme .wb-tile.gem .wb-facet-lights polygon{
  animation:wb-facet-cycle var(--gem-period,11s) ease-in-out infinite;
  animation-delay:calc(var(--gem-delay,0s) + var(--facet-lag,0ms));
}
@keyframes wb-facet-cycle{0%,83%{opacity:0;}86%{opacity:.48;}89%{opacity:.08;}92%,100%{opacity:0;}}
.bookworm-theme .wb .wb-tile.gem{
  clip-path:none;border:1px solid color-mix(in srgb,var(--jewel) 55%,#16100b);
  border-radius:4px;
  box-shadow:inset 0 1px 0 #fff7,0 3px 0 color-mix(in srgb,var(--jewel) 50%,#20180d),0 4px 7px var(--tile-shade);
}
.bookworm-theme .wb-tile.gem .wb-letter,
.bookworm-theme .wb-attack-label{
  position:relative;z-index:2;
  background:none;color:var(--gold-face);-webkit-text-fill-color:currentColor;
  text-shadow:var(--gold-relief);filter:none;
}
.bookworm-theme .wb .wb-actions #wb-attack{
  --jewel:#279c43;font-family:var(--display-font);font-size:1.55rem;font-weight:400;text-transform:none;
  clip-path:none;border:1px solid #164622;border-radius:0;overflow:hidden;
  border-image-source:url('/lab/7/facets/princess.svg');border-image-slice:23 fill;
  border-image-width:7px;border-image-repeat:stretch;
  box-shadow:inset 0 1px 0 #95d9a1,inset 1px 0 0 #6ab87c,inset -1px 0 0 #174d27,inset 0 -2px 0 #103d1d,0 2px 3px #0007;
}
.bookworm-theme .wb .wb-actions #wb-attack::before{
  content:"";position:absolute;inset:7px;z-index:0;pointer-events:none;clip-path:none;border-radius:0;
  background:linear-gradient(155deg,color-mix(in srgb,var(--jewel) 83%,#c5ffd2),var(--jewel) 40%,color-mix(in srgb,var(--jewel) 75%,#031a0c));
  border:1px solid #d4ffe033;
}
.bookworm-theme .wb .wb-actions #wb-attack::after{display:none;content:none;}
.bookworm-theme .wb .wb-attack-glint{
  position:absolute;inset:-1px;z-index:1;pointer-events:none;
}
.bookworm-theme .wb .wb-actions #wb-attack.is-ready .wb-facet-lights polygon{
  animation:wb-facet-ready 850ms ease-out both;animation-delay:var(--facet-lag,0ms);
}
@keyframes wb-facet-ready{0%{opacity:0;}24%{opacity:.62;}60%{opacity:.12;}100%{opacity:0;}}
@media(prefers-reduced-motion:reduce){
  .bookworm-theme .wb-tile.gem .wb-facet-lights polygon,
  .bookworm-theme .wb .wb-actions #wb-attack.is-ready .wb-facet-lights polygon{animation:none;opacity:0;}
}
.bookworm-theme .wb .wb-actions #wb-attack:disabled{--jewel:#325b37;color:#ccb981;opacity:.65;}
.bookworm-theme .wb .wb-actions #wb-attack:not(:disabled):hover{--jewel:#35bd50;background:var(--facet-surface);}
.bookworm-theme .wb .wb-actions #wb-attack:not(:disabled):active{--jewel:#19742e;background:var(--facet-surface);}

/* Desktop sound control lives under Games. No logo offset or extra toolbar
   column; portrait retains the compact header icon on the right. */
@media(min-width:641px),(orientation:landscape){
  .bookworm-theme .game-site-header{min-height:100px;align-items:flex-start;padding:16px max(20px,env(safe-area-inset-right)) 12px max(20px,env(safe-area-inset-left));}
  .bookworm-theme .wb > #wb-audio-mute{top:60px;left:max(20px,env(safe-area-inset-left));right:auto;}
}
@media(max-width:640px) and (orientation:portrait){
  .bookworm-theme .wb .wb-scene .wb-who .wb-name{font-size:1.1rem;}
}
