:root{--color-blue: #3BB4E8;--color-magenta: #E91E8C;--color-magenta-light: #F594C2;--color-yellow: #FFE033;--color-gold: #D4AF37;--color-green: #1B6B3A;--color-white: #F7F9FA;--color-bg: var(--color-blue);--color-bg-card: var(--color-magenta);--color-accent: var(--color-yellow);--success-bg: var(--color-yellow);--success-text: var(--color-green);--color-text-primary: var(--color-green);--color-text-on-magenta: var(--color-white);--color-text-on-yellow: var(--color-green);--color-text-muted: rgba(255, 255, 255, .8);--font-heading: "Oswald", "Arial Narrow", sans-serif;--font-display: "Archivo Black", "Arial Black", sans-serif;--font-accent: "Playfair Display", Georgia, serif;--font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--text-shadow-heading: 2px 2px 0 var(--color-white);--shadow-card: 4px 4px 0 rgba(0, 0, 0, .2);--radius: 4px}*{box-sizing:border-box}body{margin:0;font-family:var(--font-body);background:var(--color-bg);min-height:100vh}h1,h2,h3{font-family:var(--font-heading);font-style:italic;text-transform:uppercase;color:var(--color-text-primary);text-shadow:var(--text-shadow-heading);letter-spacing:.02em}h1{font-size:3rem;text-shadow:3px 3px 0 var(--color-white);text-align:left}.card-overlay,.card-overlay h1{text-align:center}.prompt{font-family:var(--font-display);font-size:1.1rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-primary)}.card .prompt{font-family:var(--font-body);font-weight:800;color:var(--color-text-on-magenta)}.prompt-action,.card .prompt-action{color:var(--color-yellow)}.label-small{font-family:var(--font-body);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--color-green)}.card{background:var(--color-bg-card);padding:24px;border-radius:var(--radius);box-shadow:var(--shadow-card)}.card h1,.card h2,.card h3{color:var(--color-text-primary);text-shadow:var(--text-shadow-heading)}.card p{font-family:var(--font-body);font-weight:600;color:var(--color-text-on-magenta)}.btn{padding:12px 24px;font-size:16px;font-family:var(--font-display);text-transform:uppercase;border:none;border-radius:var(--radius);cursor:pointer;transition:transform .1s,box-shadow .1s}.btn:hover{transform:translate(-1px,-1px);box-shadow:3px 3px #0003}.btn:active{transform:translate(1px,1px);box-shadow:1px 1px #0003}.btn-primary{background:var(--color-yellow);color:var(--color-magenta)}.btn-secondary{background:var(--color-white);color:var(--color-magenta)}.btn-danger{background:var(--color-magenta);color:var(--color-white);border:2px solid var(--color-white)}.input{padding:12px;font-size:16px;font-weight:600;border:2px solid var(--color-white);border-radius:var(--radius);background:var(--color-white);color:var(--color-magenta);width:100%}.input::placeholder{color:var(--color-magenta);opacity:.5}.input:focus{outline:none;border-color:var(--color-yellow)}.accent-band{background:var(--color-yellow);padding:8px 16px;border-radius:var(--radius);color:var(--color-green);font-family:var(--font-display);font-weight:400;text-transform:uppercase;letter-spacing:.02em}.text-on-blue{color:var(--color-text-primary);text-shadow:var(--text-shadow-heading)}.text-on-magenta{color:var(--color-text-on-magenta)}.text-on-yellow{color:var(--color-text-on-yellow)}.message-error{color:var(--color-yellow);background:#0003;padding:8px 12px;border-radius:var(--radius)}p.message-success,.message-success{background:var(--color-yellow);color:var(--color-green);padding:16px 24px;border-radius:var(--radius);font-family:var(--font-display);font-size:1.5rem;text-transform:uppercase;text-align:center;box-shadow:4px 4px #0003}.tile-xs{--tile-size: 2.5rem}.tile-s{--tile-size: 4rem}.tile-m{--tile-size: 5rem}.tile-l{--tile-size: 6rem}.tile-xl{--tile-size: 12rem}.tile-category-bamboo .tile-char{color:#1b6b3a}.tile-category-character .tile-char{color:#c41e3a}.tile-category-dot .tile-char{color:#ea580c}.tile-category-wind .tile-char{color:#1e40af}.tile-category-dragon .tile-char{color:#e91e8c}.tile-category-flower .tile-char{color:#7b2d8e}.tile-category-season .tile-char{color:#0d9488}.tile-category-hidden .tile-char{color:#666}.tile-group{display:inline-flex;flex-wrap:wrap;align-items:flex-start;border-radius:var(--radius, 4px);font-size:var(--tile-size, 4rem);gap:0;padding:calc(.15rem + .05em);overflow:visible;--border-width: calc(2px + .01em) ;border:var(--border-width) solid transparent;background:var(--color-white);box-shadow:none}.tile-group-annotated{--annotated-gap: calc(.18rem + .14em) ;gap:var(--annotated-gap);padding:var(--annotated-gap) calc(var(--annotated-gap) * 1.3)}.tile-group-complete{border-color:#4a7;background:#f0fff4}.tile-group-incomplete{border-color:#999;border-style:dashed;background:var(--color-white)}.tile-group-invalid{border-color:#c44;border-style:dashed;background:#fff4f4}.tile-group-action{--border-width: calc(2px + .015em) ;border-color:#ffe033;background:var(--color-white)}.tile{position:relative;display:inline-flex;align-items:center;justify-content:center;width:.8em;height:1.04em;font-size:var(--tile-size, 4rem);font-family:serif;color:#333;line-height:1;vertical-align:middle;cursor:default;-webkit-user-select:none;user-select:none;overflow:visible}.tile-char{transform:translateY(-.11em)}.tile-clickable{cursor:pointer}.tile-clickable:hover{transform:scale(1.05)}.tile-disabled{opacity:.3;cursor:not-allowed}.tile-badge{position:absolute;display:flex;align-items:center;justify-content:center;font-family:system-ui,sans-serif;font-weight:700;--badge-scale: .22;width:calc(var(--badge-scale) * var(--tile-size, 4rem));height:calc(var(--badge-scale) * var(--tile-size, 4rem));font-size:calc(.65 * var(--badge-scale) * var(--tile-size, 4rem));--badge-color: #444;color:var(--badge-color);line-height:1.4;overflow:visible;letter-spacing:.08em;--offset-top: calc(-.028 * var(--tile-size, 4rem));--offset-bottom: calc(.046 * var(--tile-size, 4rem));--offset-left: calc(-.045 * var(--tile-size, 4rem));--offset-right: calc(.043 * var(--tile-size, 4rem))}.tile-badge-circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;border-radius:50%;border:calc(.0208 * var(--tile-size, 4rem)) solid var(--badge-color);background:#fff;z-index:0}.tile-badge-label{position:relative;z-index:1;transform:translate(.058em,-.01em)}.tile-badge-number{bottom:0;right:0;transform:translate(var(--offset-right),var(--offset-bottom))}.tile-badge-wind{top:0;right:0;transform:translate(var(--offset-right),var(--offset-top))}.tile-badge-category{top:0;left:0;transform:translate(var(--offset-left),var(--offset-top))}.tile-badge-category .tile-badge-label{filter:grayscale(90%)}.tile-badge-category-emoji{border:none;background:transparent;font-size:calc(1 * var(--badge-scale) * var(--tile-size, 4rem));width:auto;height:auto;--emoji-anchor-x: .08;--emoji-anchor-y: .05;top:0;left:0;transform:translate(calc(-46% + var(--emoji-anchor-x) * var(--tile-size, 4rem)),calc(-35% + var(--emoji-anchor-y) * var(--tile-size, 4rem)))}