:root{color-scheme:dark;--ink:#f8f5ff;--muted:#b1accb;--bg:#0e1020;--panel:#181a33;--line:rgba(213,202,255,.16);--lilac:#a78bfa;--mint:#a0f29d;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-tap-highlight-color:transparent}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;width:100%;overscroll-behavior:none}body{background:radial-gradient(ellipse at 22% 14%,#343269 0%,transparent 38%),radial-gradient(ellipse at 86% 84%,#1a3a4c 0%,transparent 41%),#101222;color:var(--ink)}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:3px solid #c7ffb3;outline-offset:3px}button:disabled{opacity:.35;cursor:not-allowed}.app{max-width:1250px;min-height:100dvh;margin:auto;display:flex;flex-direction:column;padding:20px clamp(16px,3vw,40px) 10px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:60px}.brand{display:flex;align-items:center;gap:12px}.brand h1{font-weight:900;font-size:27px;letter-spacing:.19em;line-height:1;margin:0}.brand p{font-size:10px;font-weight:750;letter-spacing:.29em;color:#aaabd5;margin:7px 0 0}.logo-mark{width:41px;height:41px;border-radius:13px;position:relative;background:linear-gradient(140deg,#b073ff,#4c3ea5);box-shadow:0 7px 24px #8d65f755,inset 0 1px 1px #fff8}.logo-mark span{position:absolute;width:13px;height:13px;border-radius:50%;border:2px solid #ffffff55;box-shadow:inset -3px -4px 4px #0005,inset 2px 2px 5px #fff9}.logo-mark span:nth-child(1){top:7px;left:7px;background:#ffc67e}.logo-mark span:nth-child(2){top:7px;right:7px;background:#a8f77c}.logo-mark span:nth-child(3){bottom:7px;left:15px;background:#ff8fcc}.top-actions{display:flex;align-items:center;gap:8px}.top-actions button{border:1px solid var(--line);background:#ffffff0a;box-shadow:inset 0 1px #ffffff0a}.soft-btn{padding:11px 15px;display:flex;align-items:center;gap:9px;border-radius:14px;font-size:13px;font-weight:750}.soft-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}.icon-btn{width:42px;height:42px;border-radius:13px;font-weight:800;font-size:20px}.icon-btn.active{color:var(--mint);border-color:#87e4a766}.game-layout{flex:1;display:flex;align-items:center;justify-content:center;gap:clamp(20px,4vw,58px);padding:12px 0}.play-area{width:min(100%,530px);min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.head-up{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px}.level-tag{display:flex;align-items:center;gap:7px;color:#cbc4ef;letter-spacing:.1em;font-size:12px;font-weight:800}.level-tag strong{font-size:18px;color:white}.tag-dot{background:var(--mint);width:8px;height:8px;border-radius:50%;box-shadow:0 0 12px #73ff9a}.stats{display:flex;align-items:center;gap:12px;color:#c8c6d9;font-size:12px}.stats b{color:#fff;font-size:16px}.stats-separator{height:17px;width:1px;background:#ffffff33}.board-halo{width:100%;padding:6px;background:linear-gradient(155deg,#8586c5,#473d80 48%,#404b8d);border-radius:20px;box-shadow:0 18px 48px #0809178e,0 0 0 1px #d5cdff55,inset 0 1px #fff6}.board-frame{border-radius:13px;overflow:hidden;background:#8d9cb7}.board-frame canvas{display:block;width:100%;height:auto;aspect-ratio:7/8;touch-action:none;cursor:grab}.board-frame canvas.dragging{cursor:grabbing}.game-message{min-height:33px;padding:5px 12px;display:flex;align-items:center;justify-content:center;text-align:center;color:#c9c6e4;font-size:12px;line-height:1.45}.toolbar{width:100%;display:flex;gap:9px}.tool-btn{flex:1;min-width:0;background:#262743;border:1px solid #8583bb4d;border-radius:13px;padding:11px 6px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:750;transition:transform .1s,background .1s}.tool-btn:active,.pad button:active{transform:scale(.96);background:#3c3a68}.tool-btn svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px;flex-shrink:0}.tool-btn.hint-btn{background:linear-gradient(130deg,#44375f,#2c334f);color:#ead7fe}.pad{display:none}.side-panel{width:300px;flex:none;padding:30px 0 10px}.small-cap,.side-progress>span{font-size:11px;letter-spacing:.21em;font-weight:800;color:#a89ad3}.side-panel h2{font-size:clamp(29px,3vw,40px);letter-spacing:-.045em;line-height:1.16;margin:13px 0 19px;font-weight:850}.side-panel h2 em{font-style:normal;color:#b5a7ff}.side-panel>p{font-size:14px;line-height:1.75;color:#bbb8d2;margin-bottom:25px}.side-panel>p strong{color:#f5f0ff}.side-rules{border-top:1px solid var(--line)}.side-rules>div{display:flex;align-items:flex-start;gap:13px;padding:16px 0;border-bottom:1px solid var(--line);font-size:13px;color:#d9d7e8;line-height:1.45}.rule-index{font-size:11px;font-weight:900;color:#a9a1ff}.side-note{display:flex;align-items:center;gap:12px;background:#ffffff0b;border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:24px}.side-note>span{font-size:23px;color:#aef4af}.side-note strong{display:block;font-size:13px}.side-note small{display:block;font-size:11px;line-height:1.5;margin-top:4px;color:#a9a6c8}.side-progress{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:26px}.side-progress>strong{font-size:12px;color:#e2ddfa}.progress-track{width:100%;height:7px;border-radius:20px;background:#ffffff14;overflow:hidden}.progress-track div{height:100%;background:linear-gradient(90deg,#9184fa,#91e4c1);border-radius:inherit;width:1%}.secondary-wide{width:100%;border:1px solid #a39ac850;background:#ffffff08;border-radius:13px;text-align:left;padding:14px 16px;font-size:13px;font-weight:700;margin-top:20px;display:flex;justify-content:space-between}.footer{display:flex;justify-content:space-between;gap:10px;color:#706f98;letter-spacing:.13em;font-size:9px;font-weight:800;padding-top:9px}.modal-layer{position:fixed;z-index:20;inset:0;display:flex;align-items:center;justify-content:center;padding:18px}.modal-layer[hidden]{display:none}.modal-backdrop{position:absolute;inset:0;background:#080a18c9;backdrop-filter:blur(8px)}.modal{position:relative;overflow:auto;max-height:min(88dvh,760px);width:min(100%,480px);border:1px solid #b1a7ff5e;background:linear-gradient(150deg,#282643,#15182a);box-shadow:0 30px 90px #000b;border-radius:23px;padding:25px}.modal-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.modal h2{font-size:24px;letter-spacing:-.03em;margin:0 0 16px}.modal-close{border:1px solid #ffffff22;background:#ffffff14;border-radius:11px;width:37px;height:37px;font-size:16px}.modal-intro{color:#c8c5dc;font-size:14px;line-height:1.7}.level-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:16px}.level-grid button{height:54px;border-radius:12px;border:1px solid #8985bd66;background:#4441655c;font-weight:800;position:relative}.level-grid button.current{border-color:#a3efb6;background:#315e56;color:#fff;box-shadow:0 0 0 1px #abffbb44}.level-grid button.passed{color:#d2fbd2;border-color:#6ab48b55}.level-grid button.locked{opacity:.35}.level-grid button .star{position:absolute;bottom:3px;right:5px;color:#a3f0ae;font-size:9px}.dialog-action{width:100%;padding:15px;border-radius:13px;background:linear-gradient(110deg,#a1de9c,#75cfae);color:#102a2b;font-size:14px;font-weight:850;border:0;box-shadow:0 8px 22px #6ce7ae30;margin-top:18px}.dialog-action.secondary{background:#ffffff13;color:#e9e5fc;box-shadow:none;border:1px solid #ffffff30}.help-content>p{font-size:14px;color:#c8c5df;line-height:1.7}.help-content strong{color:#f8f5ff}.help-content ol{padding-left:20px;color:#dfdbeb;font-size:14px;line-height:1.85}.help-content .clarify{padding:12px;border-radius:12px;background:#ffffff10;border:1px solid #ffffff18;color:#bdb8d4;font-size:12px;line-height:1.65}.win-icon{font-size:62px;text-align:center;margin:10px 0 2px;filter:drop-shadow(0 0 22px #82fdac88)}.win-copy{text-align:center;color:#d3cfe7;font-size:14px;line-height:1.65}.win-number{text-align:center;color:#a5f6ba;font-size:34px;font-weight:900;letter-spacing:-.03em}.win-best{text-align:center;color:#acabc9;font-size:12px;margin:6px 0}.modal .mini-level{font-size:12px;color:#a49bc9;letter-spacing:.1em;font-weight:800;text-align:center}.shortcuts{font-size:12px;color:#aaa3c8;text-align:center;margin:14px 0 0}
@media(max-width:850px){.app{padding:10px 12px 7px}.topbar{min-height:45px}.brand h1{font-size:21px}.brand p{font-size:8px;margin-top:5px}.logo-mark{width:34px;height:34px;border-radius:10px}.logo-mark span{transform:scale(.8);transform-origin:center}.top-actions{gap:6px}.soft-btn{padding:9px 10px;font-size:12px}.icon-btn{width:36px;height:36px;border-radius:10px}.side-panel{display:none}.game-layout{padding:4px 0 0;align-items:center}.play-area{width:min(100%,calc((100dvh - 188px)*.875),490px);gap:5px}.board-halo{padding:4px;border-radius:14px}.board-frame{border-radius:10px}.head-up{padding:1px 2px}.stats{gap:8px}.game-message{font-size:11px;min-height:26px}.tool-btn{padding:10px 5px;font-size:11px;gap:5px}.tool-btn svg{height:17px;width:17px}.footer{font-size:8px;padding-top:2px}}
@media(max-width:580px){.app{height:100dvh;min-height:490px;overflow:hidden}.topbar{min-height:39px}.brand{gap:8px}.brand h1{font-size:19px}.brand p{font-size:7px;letter-spacing:.23em}.logo-mark{width:30px;height:30px}.logo-mark span{transform:scale(.65)}.soft-btn{padding:8px}.soft-btn span{display:none}.icon-btn{width:33px;height:33px}.play-area{width:min(100%,calc((100dvh - 205px)*.875),480px);gap:4px}.head-up{min-height:25px}.level-tag{font-size:10px}.level-tag strong{font-size:15px}.stats{font-size:10px}.stats b{font-size:13px}.board-halo{padding:4px}.game-message{min-height:29px;font-size:10px}.tool-btn{min-height:40px;padding:6px 4px}.pad{display:flex;flex-direction:column;align-items:center;gap:0;margin-top:0}.pad-middle{display:flex;justify-content:center;gap:27px;align-items:center}.pad button{width:34px;height:29px;border-radius:8px;background:#312f53;border:1px solid #ffffff24;font-size:17px;line-height:1}.pad-center{color:#a39af0;font-size:18px}.footer{display:none}}
@media(max-height:730px) and (max-width:580px){.app{padding-top:5px}.game-layout{padding:0}.play-area{width:min(100%,calc((100dvh - 190px)*.875),480px)}.toolbar{gap:5px}.tool-btn{min-height:35px}.pad button{height:26px}.game-message{min-height:24px}.topbar{min-height:35px}}
@media(max-height:510px){.app{min-height:0;height:auto;overflow:auto}.game-layout{padding:8px 0}.play-area{width:min(64vw,calc((100dvh - 100px)*.875))}.side-panel{display:none}.footer{display:none}.pad{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
/* Cabeçalho com a organização da Domus Logica, nas cores da Orbis. */
.topbar{gap:16px;border-bottom:1px solid #a79bd447;padding:6px 0 12px;margin-bottom:7px;min-height:76px}.brand{gap:12px}.brand h1{font-family:Georgia,'Times New Roman',serif;font-size:38px;font-variant:small-caps;letter-spacing:.02em;text-shadow:none}.brand p{font-family:Georgia,'Times New Roman',serif;font-size:17px;font-weight:400;letter-spacing:0;color:#c9bfdc;margin-top:3px}.app-icon{border:0;background:transparent;padding:0;flex:none;border-radius:12px;line-height:0;cursor:pointer}.app-icon img{display:block;border-radius:12px;object-fit:contain}.app-icon:hover{filter:brightness(1.1)}.app-icon:focus-visible{outline:2px solid #c6b2ff;outline-offset:4px}.about-content{text-align:center}.about-logo{background:#fff;border-radius:12px;padding:12px;margin:4px 0 16px}.about-logo img{max-width:100%;height:auto}.about-app-icon{border-radius:15px}.about-content h3{font:small-caps 32px Georgia,serif;margin:10px 0 4px}.about-subtitle{color:#c9bfdc;margin:0 0 17px}.about-features{display:grid;gap:9px;padding:15px;border:1px solid #ffffff25;border-radius:12px;text-align:left;font-size:13px;line-height:1.5;background:#ffffff08}.about-author{display:grid;gap:6px;margin-top:18px;padding-top:15px;border-top:1px solid #ffffff25;font-size:13px}.about-author span{font-size:12px;color:#b1accb}.about-author a{color:#c7b4ff}.play-area{width:min(100%,calc((100dvh - 238px)*.875),540px)}
@media(max-width:850px){.topbar{min-height:64px;padding:2px 0 8px;gap:8px}.app-icon img{width:44px;height:44px}.brand h1{font-size:29px}.brand p{font-size:13px}.play-area{width:min(100%,calc((100dvh - 214px)*.875),490px)}}
@media(max-width:580px){.topbar{min-height:57px;margin-bottom:3px;padding-bottom:6px;gap:5px}.brand{gap:8px}.app-icon img{width:40px;height:40px}.brand h1{font-size:26px}.brand p{font-size:11px;letter-spacing:0}.top-actions{gap:5px}.play-area{width:min(100%,calc((100dvh - 229px)*.875),480px)}}
@media(max-height:730px) and (max-width:580px){.play-area{width:min(100%,calc((100dvh - 221px)*.875),480px)}}
@media(max-height:510px){.play-area{width:min(64vw,calc((100dvh - 135px)*.875))}}