@import "https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Handlee&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap";:root{--paper-bg:#fdfbf7;--text:#1a1a1a;--ink-black:#1a1a1a;--ink-pencil:#64748b;--academic-slate:#1e293b;--academic-accent:#334155;--success:#16a34a;--danger:#dc2626;--highlight-word:#fef08ae6;--highlight-cell:#fef08abf;--success-stamp:#16a34a;--ink-bleed:#0000000d;--black-cell:#1a1a1a;--cell-border:#1a1a1a;--cell-active:var(--academic-slate);--cell-highlight:var(--highlight-word);--card-bg:#fff;--shadow:0 2px 8px #0000001a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text);min-height:100vh;font-family:EB Garamond,serif;position:relative}body:before{content:"";z-index:-1;background-color:var(--paper-bg);filter:contrast(96%)brightness(102%);pointer-events:none;background-image:linear-gradient(#00000003 1px,#0000 1px),linear-gradient(90deg,#00000003 1px,#0000 1px);background-size:20px 20px;position:fixed;inset:0}#app{max-width:1100px;margin:0 auto;padding:.75rem}header{text-align:center;margin-bottom:1.25rem}header h1{letter-spacing:.1em;text-transform:uppercase;color:var(--academic-slate);border-bottom:4px double var(--academic-slate);padding-bottom:.2rem;font-family:Playfair Display,serif;font-size:2.2rem;font-weight:800;display:inline-block}.subtitle{color:var(--academic-accent);margin-top:.3rem;font-family:EB Garamond,serif;font-size:1.1rem;font-style:italic;font-weight:500}.puzzle-meta{color:var(--academic-accent);margin-top:.25rem;font-size:.85rem;line-height:1.3}.stamp-container{pointer-events:none;z-index:50;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-15deg)}.stamp-container.animate-stamp{animation:.6s cubic-bezier(.175,.885,.32,1.275) forwards stamp-thud}@keyframes stamp-thud{0%{opacity:0;transform:translate(-50%,-50%)scale(3)rotate(-35deg)}70%{opacity:.9;transform:translate(-50%,-50%)scale(1)rotate(-15deg)}to{opacity:.8;transform:translate(-50%,-50%)scale(1)rotate(-15deg)}}.stamp{filter:drop-shadow(0 4px 12px #0003);width:280px;height:auto}.hidden{display:none!important}.btn{cursor:pointer;background:var(--accent);color:#fff;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.9rem;transition:background .15s}.btn:hover{background:#1d4ed8}.btn-secondary{background:#6b7280}.btn-secondary:hover{background:#4b5563}.selector-panel{flex-direction:column;gap:.85rem;display:flex}.selector-section{flex-direction:column;gap:.35rem;display:flex}.selector-section__title{font-family:Georgia,Times New Roman,serif;font-size:1.1rem}.selector-section__subtitle{color:#666;font-size:.9rem}.puzzle-list{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.85rem;display:grid}.puzzle-card{background:var(--card-bg);box-shadow:var(--shadow);cursor:pointer;border:1px solid #1a1a1a14;border-radius:14px;flex-direction:column;gap:.5rem;padding:.95rem;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex}.puzzle-card__top{justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.puzzle-card__size{color:#475569;letter-spacing:.04em;font-family:monospace;font-size:.76rem;font-weight:700}.puzzle-card:hover{border-color:#2563eb38;transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.puzzle-card h3{font-family:Georgia,Times New Roman,serif;font-size:1.08rem;line-height:1.25}.puzzle-card__theme{color:#666;font-size:.86rem;line-height:1.45}.puzzle-card--solved{border-left:4px solid var(--success)}.puzzle-card--in_progress{border-left:4px solid #f59e0b}.puzzle-card--available{border-left:4px solid #0000}.puzzle-card__meta{color:#64748b;flex-wrap:wrap;gap:.35rem .75rem;font-size:.78rem;display:flex}.empty-state{text-align:center;background:#ffffffe0;border:1px dashed #1a1a1a2e;border-radius:14px;flex-direction:column;gap:.75rem;padding:1.25rem;display:flex}.empty-state h3{font-size:1.05rem}.empty-state p{color:#666;line-height:1.45}.loading{text-align:center;color:#999;padding:2rem}.modal{z-index:100;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--card-bg);text-align:center;border-radius:12px;padding:2rem;box-shadow:0 8px 32px #0003}.modal-content h2{color:var(--success);margin-bottom:.5rem;font-family:Georgia,Times New Roman,serif;font-size:1.5rem}.tutorial-overlay{z-index:200;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.tutorial-card{text-align:center;background:#fff;border-radius:12px;width:90%;max-width:400px;padding:2rem;box-shadow:0 8px 32px #0000004d}.tutorial-step{color:#999;letter-spacing:.05em;margin-bottom:.5rem;font-size:.75rem}.tutorial-title{color:var(--text);margin-bottom:.75rem;font-family:Georgia,Times New Roman,serif;font-size:1.3rem}.tutorial-description{color:#555;margin-bottom:1.5rem;font-size:.95rem;line-height:1.5}.tutorial-actions{justify-content:center;gap:.75rem;display:flex}.tutorial-btn{min-width:100px}.pencil-help{text-align:left;width:min(92vw,430px);max-width:430px}.pencil-help__title{color:var(--accent)}.pencil-help__description{color:#555;margin-bottom:.9rem;line-height:1.5}.pencil-help__list{color:#444;margin:0 0 1.25rem 1.2rem;line-height:1.5}.pencil-help__actions{justify-content:flex-end}.puzzle-view{position:relative}.btn-back{cursor:pointer;color:var(--text);background:0 0;border:none;border-radius:6px;padding:.25rem .5rem;font-size:1.5rem;line-height:1;transition:background .15s;position:absolute;top:50%;left:0;transform:translateY(-50%)}.btn-back:hover{background:#00000014}.grid-container{flex-direction:column;align-items:center;gap:0;display:flex}.progress-counter{display:none}.grid{background:var(--cell-border);border:1px solid var(--ink-black);aspect-ratio:1;width:100%;max-width:min(90vw,500px);box-shadow:0 0 0 1px var(--ink-bleed);gap:1px;display:grid}.cell{aspect-ratio:1;background:#fff;position:relative}.cell--black{background:var(--black-cell);opacity:.95;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")}.cell--letter{background:#fff}.cell--active{outline:2px solid var(--academic-slate);outline-offset:-2px;z-index:2;background:var(--highlight-cell)!important}.cell--highlight{background:var(--highlight-word);box-shadow:0 0 0 3px var(--highlight-word)}.cell--wrong{background:#fecaca!important}.cell--revealed{background:#dcfce7}.cell__number{color:#666;pointer-events:none;z-index:1;font-size:.55rem;line-height:1;position:absolute;top:1px;left:2px}.cell__input{text-align:center;text-transform:uppercase;caret-color:#0000;cursor:pointer;width:100%;height:100%;color:var(--ink-black);background:0 0;border:none;outline:none;padding:0;font-family:Handlee,cursive;font-size:1.4rem;font-weight:700}.cell__input.animate-ink{animation:.4s linear forwards ink-flow}@keyframes ink-flow{0%{clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}.cell--pencil .cell__input{color:var(--ink-pencil);opacity:.8;font-size:1.1rem;transform:translateY(-15%)}.cell--smudge:after{content:"";pointer-events:none;background:radial-gradient(circle,#0000000f 0%,#0000 70%);border-radius:50%;width:8px;height:8px;position:absolute}.cell--smudge-tr:after{top:-2px;right:-2px}.cell--smudge-bl:after{bottom:-2px;left:-2px}.cell__input:focus{outline:none}.cell__input[readonly]{cursor:default}.toolbar{width:min(100%,500px);box-shadow:var(--shadow);background:#ffffffc7;border-radius:14px;flex-wrap:wrap;justify-content:center;gap:.45rem;margin-top:.65rem;padding:.3rem;display:flex}.btn-pencil{background:#64748b;justify-content:center;align-items:center;gap:.45rem;min-width:8.25rem;display:inline-flex}.btn-pencil:hover{background:#475569}.btn-pencil__icon{font-size:1rem;line-height:1;display:none}.btn:disabled,.btn:hover:disabled{cursor:default;opacity:.55;background:#94a3b8}.btn-pencil__label{font-weight:600}.btn-pencil__state{background:#fff3;border-radius:999px;padding:.15rem .5rem;font-size:.78rem;line-height:1.2}.touch-remote{width:min(100%,500px);box-shadow:var(--shadow);background:#ffffffe6;border-radius:18px;flex-direction:column;gap:.45rem;margin-top:.75rem;padding:.7rem;display:flex}.touch-remote__row{gap:.35rem;display:grid}.touch-remote__row--top{grid-template-columns:repeat(10,minmax(0,1fr))}.touch-remote__row--middle{grid-template-columns:repeat(9,minmax(0,1fr));padding-inline:1rem}.touch-remote__row--bottom{grid-template-columns:minmax(3.5rem,1.15fr) repeat(7,minmax(0,1fr)) minmax(3.5rem,1.15fr)}.touch-remote__key{min-height:3rem;color:var(--text);cursor:pointer;background:#f8fafc;border:1px solid #1a1a1a14;border-radius:14px;font-family:Georgia,Times New Roman,serif;font-size:1.02rem;font-weight:700;transition:transform .1s,background .15s,box-shadow .15s;box-shadow:0 1px 3px #0f172a1f}.touch-remote__key:hover{background:#e2e8f0}.touch-remote__key:active{transform:translateY(1px)}.touch-remote__key:disabled{cursor:default;opacity:.55;transform:none}.touch-remote__key--direction,.touch-remote__key--delete{color:#fff;background:#1e293b}.touch-remote__key--direction:hover,.touch-remote__key--delete:hover{background:#0f172a}.touch-remote__direction-icon{place-items:center;width:2rem;height:2rem;display:inline-grid;position:relative}.touch-remote__direction-core{background:#ffffffe0;border-radius:999px;width:.35rem;height:.35rem}.touch-remote__arrow{color:#ffffff52;font-size:.95rem;line-height:1;transition:color .15s,transform .15s;position:absolute}.touch-remote__arrow--up{top:-.05rem}.touch-remote__arrow--right{right:-.05rem}.touch-remote__arrow--down{bottom:-.05rem}.touch-remote__arrow--left{left:-.05rem}.touch-remote__key--horizontal .touch-remote__arrow--left,.touch-remote__key--horizontal .touch-remote__arrow--right,.touch-remote__key--vertical .touch-remote__arrow--up,.touch-remote__key--vertical .touch-remote__arrow--down{color:#fff;transform:scale(1.15)}.clues-container{flex-direction:column;gap:1rem;display:flex}.clue-section h3{font-size:calc(var(--clue-font-size,.9rem) + .1rem);border-bottom:2px solid var(--accent);margin-bottom:.5rem;padding-bottom:.25rem}.clue-list{padding:0;list-style:none}.clue-item{font-size:var(--clue-font-size,.9rem);cursor:pointer;border-radius:4px;padding:.4rem .5rem;line-height:1.4;transition:background .1s}.clue-item:hover{background:var(--accent-light)}.clue-item--active{background:var(--cell-highlight);font-weight:600}.clue-item--complete{color:#595959;text-decoration:line-through}.cell--pencil .cell__input{color:#93c5fd}.btn-pencil--active{color:#fff;background:#2563eb}.btn-pencil--active .btn-pencil__state{background:#ffffff38}.font-scaler{justify-content:flex-end;align-items:center;gap:.25rem;margin-bottom:.5rem;display:flex}.font-scaler__btn{background:var(--card-bg);cursor:pointer;width:28px;height:28px;color:var(--text);border:1px solid #ccc;border-radius:4px;justify-content:center;align-items:center;font-size:1rem;font-weight:600;transition:background .1s;display:flex}.font-scaler__btn:hover{background:var(--accent-light)}.font-scaler__label{color:#666;text-align:center;min-width:2.5rem;font-size:.75rem}.selector-controls{z-index:5;position:sticky;top:.5rem}.selector-toolbar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--shadow);background:#ffffffeb;border:1px solid #1a1a1a14;border-radius:16px;padding:.75rem .85rem}.selector-toolbar--sizes{overflow:hidden}.selector-size-scroller{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.35rem;display:grid}.selector-size-scroller--overflow{position:relative}.selector-size-row{scrollbar-width:none;-ms-overflow-style:none;gap:.45rem;display:flex;overflow-x:auto}.selector-size-row::-webkit-scrollbar{display:none}.selector-size-arrow{color:#475569;cursor:pointer;width:2.25rem;height:2.25rem;box-shadow:var(--shadow);background:#fffffff5;border:1px solid #1a1a1a1f;border-radius:999px;font-family:Georgia,Times New Roman,serif;font-size:1rem;font-weight:700}.selector-size-arrow:disabled{opacity:.35;cursor:default}.size-chip{background:var(--card-bg);color:#475569;cursor:pointer;border:1px solid #1a1a1a1f;border-radius:999px;flex:none;min-width:2.65rem;min-height:2.65rem;padding:.4rem .8rem;font-family:Georgia,Times New Roman,serif;font-size:.9rem;font-weight:600;transition:color .15s,border-color .15s,background .15s}.size-chip:hover{color:var(--text);border-color:#2563eb4d}.size-chip--active{background:var(--black-cell);border-color:var(--black-cell);color:#fff}.definition-bar{background:var(--card-bg);border:2px solid var(--black-cell);border-bottom:none;grid-template-columns:3.15rem minmax(0,1fr);align-items:center;gap:.65rem;width:100%;max-width:min(90vw,500px);min-height:3.5rem;padding:.2rem .75rem;line-height:1.15;transition:opacity .15s;display:grid;overflow:hidden}.definition-bar--empty{opacity:.3}.definition-bar__badge{background:var(--black-cell);color:#fff;letter-spacing:.03em;text-align:center;border-radius:3px;grid-template-rows:auto auto;align-content:center;justify-items:center;width:100%;min-height:2.8rem;padding:.2rem .35rem;font-weight:700;display:grid}.definition-bar__direction{font-size:.68rem;line-height:1.1}.definition-bar__number{font-size:1rem;line-height:1.05}.definition-bar__text{color:var(--text);font-style:italic;font-size:var(--definition-font-size,1.25rem);text-wrap:pretty;text-align:center;place-items:center;min-height:2.3em;max-height:2.3em;line-height:1.15;display:grid;overflow:hidden}.header-row{justify-content:center;align-items:center;gap:1rem;display:flex;position:relative}.header-points{color:var(--accent);white-space:nowrap;font-family:Georgia,Times New Roman,serif;font-size:.9rem;font-weight:600}.nav-tabs{border-bottom:2px solid var(--black-cell);scrollbar-width:none;-ms-overflow-style:none;justify-content:center;gap:.45rem;margin-top:.75rem;padding-bottom:.35rem;display:flex;overflow-x:auto}.nav-tabs::-webkit-scrollbar{display:none}.nav-tab{color:#64748b;cursor:pointer;background:#ffffffc7;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:.35rem;min-width:2.9rem;min-height:2.9rem;padding:.35rem .65rem;transition:color .15s,border-color .15s,background .15s;display:inline-flex}.nav-tab:hover{color:var(--text);border-color:#2563eb2e}.nav-tab--active{color:#fff;background:var(--black-cell);border-color:var(--black-cell)}.nav-tab__icon{font-size:1.05rem;line-height:1}.nav-tab__count{min-width:1.15rem;min-height:1.15rem;color:var(--accent);background:#2563eb1f;border-radius:999px;justify-content:center;align-items:center;padding:0 .2rem;font-size:.68rem;font-weight:700;display:inline-flex}.nav-tab--active .nav-tab__count{color:#fff;background:#ffffff2e}.btn-hint{background:#6b7280;flex-direction:column;align-items:center;gap:.1rem;padding:.4rem .75rem;display:flex}.btn-hint:hover{background:#4b5563}.btn-hint__label{font-size:.85rem}.btn-hint__cost{opacity:.8;font-size:.65rem}.btn-tool{background:var(--accent)}.stats-section{margin-bottom:1rem}.panel-title{border-bottom:1px solid #ddd;margin-bottom:.75rem;padding-bottom:.25rem;font-family:Georgia,Times New Roman,serif;font-size:1.05rem}.stats-summary{flex-wrap:wrap;gap:1rem;display:flex}.stat-item{min-width:9rem;box-shadow:var(--shadow);background:#ffffffe6;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:1rem .75rem;display:flex}.stat-value{color:var(--text);font-family:Georgia,Times New Roman,serif;font-size:2rem;font-weight:700;line-height:1.1}.stat-label{color:#999;text-transform:uppercase;letter-spacing:.1em;text-align:center;font-size:.75rem}.challenge-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem;display:grid}.challenge-card{background:var(--card-bg);box-shadow:var(--shadow);border:1px solid #1a1a1a14;border-radius:12px;flex-direction:column;gap:.45rem;padding:.9rem;display:flex}.challenge-card--done{background:linear-gradient(#f0fdf4 0%,#fff 100%);border-color:#16a34a38}.challenge-card__top{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.challenge-card__status,.challenge-card__progress{text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-size:.72rem;font-weight:700}.challenge-card__title{font-family:Georgia,Times New Roman,serif;font-size:1rem;font-weight:700}.challenge-card__desc{color:#666;font-size:.85rem;line-height:1.45}.badge-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;display:grid}.badge-card{background:var(--card-bg);text-align:center;box-shadow:var(--shadow);border-radius:8px;padding:.75rem;transition:transform .15s}.badge-card--unlocked{border:2px solid var(--cell-active)}.badge-card--locked{opacity:.4;filter:grayscale();border:2px solid #0000}.badge-icon{margin-bottom:.25rem;font-size:1.8rem}.badge-name{margin-bottom:.15rem;font-family:Georgia,Times New Roman,serif;font-size:.85rem;font-weight:700}.badge-desc{color:#666;font-size:.7rem;line-height:1.3}.history-table{flex-direction:column;gap:.25rem;display:flex}.history-row{border-bottom:1px solid #eee;flex-wrap:wrap;gap:1rem;padding:.4rem .5rem;font-size:.85rem;display:flex}.history-date{color:#666;flex:0 0 5rem}.history-time{flex:0 0 4rem}.history-size{color:#666;flex:0 0 4.5rem}.history-hints{color:#999;flex:1}.history-points{color:var(--accent);text-align:right;font-weight:600}.history-empty{color:#666;line-height:1.45}.completion-score{flex-direction:column;align-items:center;gap:.5rem;margin:1rem 0;display:flex}.completion-score__total{color:var(--accent);font-family:Georgia,Times New Roman,serif;font-size:2.5rem;font-weight:700;line-height:1}.completion-score__label{color:#666;text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}.completion-breakdown{text-align:left;flex-direction:column;gap:.25rem;max-width:200px;margin:0 auto .75rem;font-size:.85rem;display:flex}.completion-breakdown span{justify-content:space-between;display:flex}.completion-badges{flex-wrap:wrap;justify-content:center;gap:.5rem;margin:.5rem 0;display:flex}.completion-badge{font-size:1.5rem;animation:.4s ease-out badge-pop}@keyframes badge-pop{0%{opacity:0;transform:scale(0)}70%{transform:scale(1.3)}to{opacity:1;transform:scale(1)}}.toast-container{z-index:200;pointer-events:none;flex-direction:column;gap:.5rem;display:flex;position:fixed;bottom:1.5rem;right:1.5rem}.toast{background:var(--black-cell);color:#fff;pointer-events:auto;border-radius:6px;padding:.6rem 1rem;font-size:.85rem;animation:.3s ease-out toast-in;box-shadow:0 4px 12px #0000004d}.toast--warning{background:#b45309}@keyframes toast-in{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}.puzzle-layout{flex-direction:column;gap:1.5rem;display:flex}@media (width>=768px){.puzzle-layout{flex-direction:row;align-items:flex-start}.grid-container{flex:none;width:min(50vw,500px)}.clues-container{flex:1;min-width:0;max-height:80vh;overflow-y:auto}}@media (width<=767px){.grid{max-width:95vw}.cell__input{font-size:1rem}.cell__number{font-size:.45rem}.toolbar{flex-wrap:nowrap;gap:.25rem;width:100%}.toolbar .btn{flex:1 1 0;min-width:0;padding:.38rem .2rem;font-size:.74rem}.toolbar .btn-hint__label,.toolbar .btn-pencil__label{font-size:.74rem}.toolbar .btn-hint__cost{font-size:.58rem}.toolbar .btn-pencil{gap:.15rem;min-width:0;padding-inline:.2rem}.toolbar .btn-pencil__icon{justify-content:center;align-items:center;display:inline-flex}.toolbar .btn-pencil__label,.toolbar .btn-pencil__state{display:none}.definition-bar__text{font-weight:600}.touch-remote{padding:.55rem}.touch-remote__row{gap:.25rem}.touch-remote__row--middle{padding-inline:.75rem}.touch-remote__key{border-radius:12px;min-height:2.7rem;font-size:.92rem}.puzzle-list{grid-template-columns:1fr}.selector-controls{top:.25rem}.selector-toolbar{padding:.65rem .75rem}.selector-size-row{gap:.35rem}.selector-size-scroller{gap:.25rem}.selector-size-arrow{width:2rem;height:2rem;font-size:.95rem}.stats-summary{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.challenge-grid{grid-template-columns:1fr}.stat-item{min-width:0}}@media (width<=380px){.cell__input{font-size:.85rem}.toolbar .btn{font-size:.7rem}.touch-remote__key{min-height:2.45rem;font-size:.82rem}.touch-remote__row--middle{padding-inline:.4rem}header h1{font-size:1.4rem}.header-row{gap:.45rem}.size-chip{min-height:2.45rem;font-size:.84rem}}
