/* Slim identity strips face the children on each side of the table. */
.table-identity{display:none}
body[data-view=painting]>.identity,body[data-view=painting]>.footer{display:none}
body[data-view=painting]>.table-identity{height:calc(48*var(--u));display:flex;background:#ec6608;color:#fff;padding:calc(2*var(--u)) calc(36*var(--u))}
body[data-view=painting]>.table-identity-bottom{padding-right:calc(80*var(--u))}
.table-identity-inner{width:100%;display:flex;align-items:center;justify-content:space-between;gap:calc(20*var(--u))}
.table-identity-top .table-identity-inner{transform:rotate(180deg)}
.table-identity img{width:calc(400*var(--u));height:100%;object-fit:contain;object-position:left center}
.table-identity span{font-size:calc(11*var(--u));letter-spacing:.02em}.table-identity b{font-weight:400;opacity:.8}
body[data-view=painting] #app{height:calc(100dvh - 96*var(--u));max-width:none}
body[data-view=painting] #operator-access{bottom:0;color:#fff9}
.number-note{position:absolute;bottom:calc(16*var(--u));left:calc(32*var(--u));right:calc(16*var(--u));padding:calc(20*var(--u)) calc(24*var(--u));border:1px solid #e7d7be;border-radius:calc(20*var(--u));background:#fff9ed;display:flex;align-items:center;gap:calc(20*var(--u))}
.number-note>span{color:var(--orange);font-size:calc(30*var(--u));font-weight:700;white-space:nowrap}
.number-note p{font-size:calc(15*var(--u));line-height:1.6;color:#816249}.number-note b{display:block;color:var(--ink);font-size:calc(18*var(--u))}
/* Rails reserve a single row; drawers overlay paper without resizing it. */
.painting{padding:calc(6*var(--u)) calc(22*var(--u))}
.table-layout.four{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:calc(76*var(--u)) minmax(0,1fr) calc(76*var(--u));gap:calc(6*var(--u));height:100%}
.station-a{grid-area:1/1}.station-b{grid-area:1/2}.station-c{grid-area:3/1}.station-d{grid-area:3/2}
.station{display:flex;align-items:center;justify-content:center;min-width:0;position:relative;z-index:6;--seat-accent:#bf861e}
.station-inner{position:relative;border:1px solid #e5d4b8;border-radius:calc(16*var(--u));background:#fffaf1;transform:scale(var(--tool-scale));transform-origin:center}
.station-rail{display:flex;align-items:center;gap:calc(8*var(--u));padding:calc(5*var(--u)) calc(8*var(--u))}
.station-top .station-inner{transform:rotate(180deg) scale(var(--tool-scale))}
.station-meta{width:calc(58*var(--u));display:flex;flex-direction:column;align-items:center;gap:calc(4*var(--u));color:#795b3e;flex:none}
.seat-symbol{font-size:calc(23*var(--u));color:var(--seat-accent);line-height:1}
.station-meta strong{font-size:calc(12*var(--u));font-weight:500}.station-meta small{font-size:calc(10*var(--u));color:#9f8567}
.toolbelt{display:flex;flex-direction:column;gap:calc(4*var(--u))}.palette,.tool-row{display:flex;gap:calc(3*var(--u));align-items:center}
.color-button{width:calc(52*var(--u));height:calc(52*var(--u));border:0;border-radius:calc(12*var(--u));background:transparent;display:grid;place-items:center}
.color-button i{width:calc(32*var(--u));height:calc(32*var(--u));border-radius:50%;background:var(--color);box-shadow:inset 0 0 0 1px #683c2225}
.color-button[aria-pressed=true]{background:#f6e7ce}.color-button[aria-pressed=true] i{outline:calc(2*var(--u)) solid #6b472d;outline-offset:calc(3*var(--u))}
.tools-toggle,.station-finish{min-height:calc(52*var(--u));display:flex;align-items:center;justify-content:center;gap:calc(7*var(--u));padding:calc(8*var(--u)) calc(12*var(--u));border:1px solid #e4d3bb;border-radius:calc(12*var(--u));background:#fffdf8;font-size:calc(13*var(--u));color:#76593f}
.tools-toggle{min-width:calc(155*var(--u))}.tools-toggle[aria-expanded=true]{background:#f6e7ce;border-color:#d3b081}.tools-toggle[aria-expanded=true] .tray-chevron{transform:rotate(180deg)}
.current-tool{display:flex}.current-tool svg{width:calc(20*var(--u));height:calc(20*var(--u))}.tray-chevron{font-size:calc(19*var(--u));line-height:1}
.station-finish{min-width:calc(112*var(--u));background:var(--yellow);border-color:#edcf56;color:var(--ink);font-weight:500}
.station-drawer{position:absolute;bottom:calc(100% + 6*var(--u));left:0;width:100%;padding:calc(12*var(--u));background:#fffaf1;border:1px solid #d9c4a5;border-radius:calc(16*var(--u));box-shadow:0 calc(-4*var(--u)) calc(20*var(--u)) #65451516}
.drawer-heading{display:flex;justify-content:space-between;align-items:center;gap:calc(10*var(--u));color:#795b3e;font-size:calc(13*var(--u));font-weight:500;margin-bottom:calc(7*var(--u))}.drawer-heading span{font-size:calc(11*var(--u));font-weight:400;color:#9d846b}
.drawer-controls{display:flex;align-items:center;justify-content:space-between;gap:calc(10*var(--u))}
.tool-button{display:flex;align-items:center;justify-content:center;gap:calc(5*var(--u));min-width:calc(84*var(--u));height:calc(52*var(--u));padding:0 calc(8*var(--u));border:1px solid transparent;border-radius:calc(12*var(--u));font-size:calc(12*var(--u));background:transparent;color:#806347}
.tool-button svg{width:calc(20*var(--u));height:calc(20*var(--u))}.tool-button[aria-pressed=true]{border-color:#d3b081;background:#fff0cf;color:#6a4525}
.sizes{display:flex;gap:calc(2*var(--u));border-left:1px solid #e1cdb1;margin-left:calc(3*var(--u));padding-left:calc(6*var(--u))}
.size-button{width:calc(48*var(--u));height:calc(52*var(--u));border-radius:calc(12*var(--u));border:0;background:transparent;display:grid;place-items:center}
.size-button i{width:calc(var(--size)*var(--u));height:calc(var(--size)*var(--u));border-radius:50%;background:#896d51}.size-button[aria-pressed=true]{background:#f3e0c2}
.station-actions{display:flex;gap:calc(6*var(--u));border-left:1px solid #eadbc4;padding-left:calc(10*var(--u))}
.station-actions button{min-height:calc(34*var(--u));min-width:calc(128*var(--u));padding:calc(5*var(--u)) calc(10*var(--u));display:flex;align-items:center;justify-content:center;gap:calc(6*var(--u));font-size:calc(12*var(--u));font-weight:500;border:1px solid #e4d3bb;border-radius:calc(10*var(--u));background:#fffdf8;color:#76593f}
.station-actions button[data-action=finish]{background:var(--yellow);border-color:#edcf56;color:var(--ink)}
.sheet-area{grid-area:2/1/3/3;min-height:0;min-width:0;display:flex;flex-direction:column}
.sheet-topline{display:flex;justify-content:space-between;align-items:center;font-size:calc(10*var(--u));letter-spacing:.09em;color:#9a846c;padding:0 calc(14*var(--u));flex:none}
.sheet-topline i{display:inline-block;width:calc(6*var(--u));height:calc(6*var(--u));background:#dc9e47;border-radius:50%;margin-right:calc(6*var(--u))}.sheet-topline>span:last-child{font-size:calc(12*var(--u));letter-spacing:0}
.sheet{position:relative;flex:1;min-height:0;background:#fff;border:1px solid #deceb3;border-radius:calc(12*var(--u));box-shadow:0 calc(7*var(--u)) calc(30*var(--u)) #63451918;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));overflow:hidden}
/* Fine dashed cross belongs to the paper, never to exported drawings. */
.sheet::before,.sheet::after{content:'';position:absolute;z-index:4;pointer-events:none}
.sheet::before{left:50%;top:0;bottom:0;border-left:1px dashed #b9afa3}.sheet::after{top:50%;left:0;right:0;border-top:1px dashed #b9afa3}
.sheet-bottomline{display:flex;justify-content:center;gap:calc(7*var(--u));color:#a68e70;font-size:calc(12*var(--u));flex:none}
.quadrant{min-width:0;min-height:0;overflow:hidden;position:relative;background:#fff}
.quadrant-face{height:100%;display:flex;flex-direction:column;padding:calc(8*var(--u)) calc(12*var(--u));gap:calc(4*var(--u))}
.quadrant-0 .quadrant-face,.quadrant-1 .quadrant-face{transform:rotate(180deg)}
.quadrant-heading{display:flex;align-items:center;justify-content:space-between;gap:calc(12*var(--u));flex:none;font-size:calc(12*var(--u));color:var(--seat-accent);min-height:calc(22*var(--u))}
.quadrant-heading>span{font-weight:700}.quadrant-heading small{font-weight:400;color:#b1a292}.dino-name{font-size:calc(11*var(--u));font-weight:400;color:#aa9580}
.quadrant-stage{position:relative;flex:1;min-height:0;display:flex;justify-content:center;align-items:center}
.paint-surface{position:relative;flex:none;touch-action:none;cursor:crosshair;overflow:hidden;background:#fff}
.paint-surface canvas,.paint-surface>.guide{position:absolute;inset:0;width:100%;height:100%;display:block}.paint-surface>.guide{pointer-events:none;object-fit:contain}
.cursors{position:absolute;inset:0;pointer-events:none;overflow:hidden}.cursor{position:absolute;border:2px solid #432b2090;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #ffffffa0}.cursor.eraser{background:#fff8;border-style:dashed}
.local-panel{position:absolute;inset:0;background:#fff;display:flex;align-items:center;justify-content:center;overflow:auto;overscroll-behavior:contain}
.local-choice{width:100%;height:100%;display:flex;flex-direction:column;gap:calc(7*var(--u));padding:calc(4*var(--u)) calc(18*var(--u))}
.local-choice>p{text-align:center;font-size:calc(16*var(--u));color:#84664e;font-weight:500}
.local-dinosaur-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:calc(8*var(--u))}
.local-dinosaur-grid button{min-height:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(2*var(--u));background:#fff;border:1px solid #ecdfcd;border-radius:calc(12*var(--u));padding:calc(5*var(--u));color:#76543a}
.local-dinosaur-grid button:hover{border-color:#ecaa66;background:#fffaf1}.local-dinosaur-grid img{width:100%;flex:1;min-height:0;object-fit:contain;mix-blend-mode:multiply}.local-dinosaur-grid span{flex:none;font-size:calc(12*var(--u));font-weight:500}
.local-message{text-align:center;display:flex;align-items:center;flex-direction:column;gap:calc(14*var(--u));padding:calc(10*var(--u))}
.local-message h3,.local-review h3{margin:0;font-size:calc(22*var(--u));letter-spacing:-.03em}.local-message p,.local-review p{font-size:calc(14*var(--u));line-height:1.5;color:#8b705a}.local-symbol svg{width:calc(30*var(--u));height:calc(30*var(--u));color:var(--seat-accent)}
.local-actions{display:flex;justify-content:center;gap:calc(10*var(--u));flex:none}.local-actions .button,.local-message>.button{min-height:calc(46*var(--u));padding:calc(9*var(--u)) calc(18*var(--u));font-size:calc(14*var(--u));border-radius:calc(12*var(--u));gap:calc(6*var(--u))}
.local-review{height:100%;width:100%;padding:calc(8*var(--u));display:flex;align-items:center;flex-direction:column;gap:calc(8*var(--u));text-align:center}.local-review>img{flex:1;min-height:0;max-width:95%;width:100%;object-fit:contain}.local-review small{color:#9e8771;font-size:calc(10*var(--u))}.local-review .local-error{font-size:calc(12*var(--u));color:#ab3421}.local-complete p{font-size:calc(12*var(--u))}
.fixed-seats{display:flex;align-items:center;justify-content:center;color:#8b705a;font-size:calc(17*var(--u));border:1px dashed #d9c4aa;border-radius:calc(14*var(--u));padding:calc(16*var(--u))}
@media(orientation:portrait){.painting .table-layout{visibility:hidden}.number-note{position:relative;inset:auto;margin-top:18px;padding:16px;gap:14px}.number-note>span{font-size:24px}.number-note p{font-size:13px}.number-note b{font-size:15px}}