:root{font-family:"Nunito",system-ui,sans-serif;color:#282d39;background:#e3d5b8;font-synthesis:none}*{box-sizing:border-box}body{margin:0}.hidden{display:none!important}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible{outline:3px solid #e54e54;outline-offset:2px}.page{min-height:100vh;background:repeating-linear-gradient(0deg,#e2d5b9 0 29px,#d5c6a8 30px 31px);position:relative;overflow:hidden}.page:before{content:"";position:absolute;top:0;bottom:0;left:8%;border-left:3px solid #c8687188;pointer-events:none}header{height:60px;padding:10px 24px;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:2}header a{font-weight:1000;text-decoration:none;color:#294569}header button,.settings button{border:2px solid #253f60;border-radius:9px;background:#fffaf0;color:#284469;padding:7px 12px;font-weight:900;box-shadow:2px 3px 0 #223956}main{display:grid;grid-template-columns:minmax(310px,660px) minmax(260px,340px);gap:clamp(20px,4vw,70px);align-items:center;justify-content:center;min-height:calc(100vh - 60px);padding:15px 24px 40px;position:relative;z-index:1}.paper{width:min(100%,71vh);justify-self:center;background:#fcf7e9;border:2px solid #d9c9a7;box-shadow:6px 9px 0 #8b8a8980,0 14px 35px #342b2540;border-radius:7px;padding:16px 17px 8px;transform:rotate(-.3deg)}.paper-head{display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:39px}.paper-head span{font-size:.8rem;font-weight:1000;color:#526b90}.paper-head strong{font-family:"Baloo 2",system-ui;font-size:1.3rem;color:#2f4261}.paper #board{width:100%;aspect-ratio:1;position:relative;margin:6px auto}.paper #board.classic,.paper #board.ultimate,.paper #board.gomoku{display:grid;background:#fffdf5;border:4px solid #324d72;border-radius:7px;overflow:hidden}.paper #board.classic{grid-template-columns:repeat(3,1fr)}.paper #board.ultimate{grid-template-columns:repeat(9,1fr)}.paper #board.gomoku{grid-template-columns:repeat(15,1fr)}.cell{border:1px solid #90abc0;background:#fffdf5;display:grid;place-items:center;padding:0;color:#e15152;line-height:1;font-family:"Baloo 2",system-ui;font-weight:900;position:relative}.cell:hover:not(:disabled){background:#f8eab7}.cell.x{color:#e15458}.cell.o{color:#3b84af}.cell.recent{background:#ffefb0}.cell.hint{box-shadow:inset 0 0 0 5px #f1bd4b}.classic .cell{font-size:clamp(50px,9vw,115px);border-width:2px}.ultimate .cell{font-size:clamp(17px,3vw,37px)}.ultimate .cell.sub-right{border-right:4px solid #324d72}.ultimate .cell.sub-bottom{border-bottom:4px solid #324d72}.ultimate .cell.locked{background:#dee7e7}.ultimate .cell.forced{background:#fff7d8}.gomoku .cell{font-size:clamp(11px,1.9vw,25px)}.cell.pop span{animation:pop .3s both}@keyframes pop{0%{transform:scale(1.8) rotate(-20deg);opacity:.2}100%{transform:scale(1);opacity:1}}.paper #help{min-height:40px;text-align:center;font-size:.85rem;color:#627085;font-weight:800;margin:6px 0 0}.dots-board{border:4px solid #324d72;border-radius:7px;background-color:#fffdf5;background-image:repeating-linear-gradient(0deg,transparent 0 calc(25% - 1px),#d9e5e9 calc(25% - 1px) 25%),repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),#d9e5e9 calc(25% - 1px) 25%)}.dot{position:absolute;width:3%;height:3%;background:#314c71;border-radius:50%;transform:translate(-50%,-50%);z-index:2}.edge{position:absolute;border:0;border-radius:15px;background:#d3d9d9;opacity:.5;z-index:3}.edge:hover{background:#ecc264;opacity:1}.edge.claimed{opacity:1}.edge.x{background:#e05357}.edge.o{background:#3585b4}.edge.horizontal{height:3.6%;width:22%;transform:translateY(-50%)}.edge.vertical{width:3.6%;height:22%;transform:translateX(-50%)}.box{position:absolute;width:24%;height:24%;display:grid;place-items:center;color:#fff;font-size:2rem;font-weight:900;pointer-events:none}.box.x{background:#e0535799}.box.o{background:#3585b499}.logo{text-align:center;transform:rotate(1.5deg)}.scribble{font-size:3rem;font-family:cursive;color:#e3575a}.scribble i{color:#3786b4;font-style:normal}.logo h1{font-family:"Baloo 2",system-ui;font-size:clamp(2.6rem,5vw,4rem);line-height:1;margin:0;color:#283f5c;text-shadow:2px 2px #fff}.logo p{font-size:.95rem;font-weight:800;color:#667183;margin:2px 0 23px}.info{background:#fffaf1;border:2px solid #6d8197;border-radius:9px;box-shadow:4px 5px 0 #576e83;padding:16px;display:flex;flex-direction:column;min-height:100px}.info strong{font-family:"Baloo 2",system-ui;font-size:1.7rem;line-height:1.2;color:#284364}.info span{font-size:.85rem;line-height:1.35}.tools{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:19px}.tools button,.menu-actions button,.modes button{background:#fff9eb;border:2px solid #334f71;border-radius:9px;padding:10px;color:#2e4c6d;font-weight:1000;box-shadow:3px 4px 0 #2f4869;transition:transform .12s,box-shadow .12s}.tools button:hover,.menu-actions button:hover,.modes button:hover{transform:translateY(-2px);box-shadow:3px 6px 0 #2f4869}.tools button:active,.menu-actions button:active,.modes button:active{transform:translateY(3px);box-shadow:1px 1px 0 #2f4869}.tools button:disabled{opacity:.5;cursor:default}.tools .primary,.menu-actions .primary{grid-column:span 2;background:#f3a268;color:#3d3044;border-color:#805575;box-shadow:3px 4px 0 #805575}.streak{display:flex;justify-content:space-between;margin-top:21px;font-weight:900;color:#384e66}.settings{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:17px;font-size:.8rem;font-weight:800}.settings select{max-width:120px;padding:7px;border:2px solid #506f91;border-radius:8px;background:#fffaf0}.overlay{position:fixed;inset:0;z-index:5;background:#293b52aa;backdrop-filter:blur(4px);display:grid;place-items:center;padding:15px;overflow:auto}.card{width:min(96vw,520px);background:#fffdf2;color:#2b405e;border:3px solid #405b7b;border-radius:10px;box-shadow:8px 9px 0 #253b59,0 20px 40px #15233388;padding:20px clamp(18px,4vw,32px) 25px;text-align:center}.mascot{display:block;width:min(72%,290px);height:105px;object-fit:contain;margin:0 auto;filter:drop-shadow(2px 4px 2px #73809555)}.card h2{font:900 2rem/1.1 "Baloo 2",system-ui;margin:8px 0}.card p{margin:6px auto 15px}.modes{display:grid;grid-template-columns:1fr 1fr;gap:9px}.modes button{text-align:left;display:flex;flex-direction:column}.modes button.active{background:#f9e2a1;border-color:#d35558;box-shadow:3px 4px 0 #a74950}.modes small{font-size:.73rem;font-weight:700}.pick{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-top:17px;font-weight:900}.pick select{width:55%;padding:9px;border:2px solid #597795;border-radius:8px;background:#fffdf2}.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.menu-actions button.primary{grid-column:span 2}.menu-actions button:last-child.hidden{display:none}.trophy{font-size:4rem;color:#e5a33f}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:8;background:#263f60;color:#fff;padding:10px 19px;border-radius:25px;box-shadow:0 5px 18px #17253688;text-align:center;max-width:90vw}@media(max-width:840px){main{grid-template-columns:1fr;gap:24px;min-height:0}.paper{width:min(100%,68vh)}aside{width:min(100%,620px);justify-self:center}.logo p{margin-bottom:10px}}@media(max-width:520px){header{height:44px;padding:4px 10px}main{padding:5px 12px 35px;gap:15px}.paper{width:min(100%,55vh);padding:8px}.paper-head{min-height:32px}.paper-head strong{font-size:1.02rem}.paper #help{font-size:.75rem;min-height:28px}.logo .scribble{display:none}.logo h1{font-size:2rem}.logo p{margin:0 0 8px}.info{padding:10px;min-height:auto}.info strong{font-size:1.35rem}.tools{margin-top:12px}.streak,.settings{margin-top:12px}.ultimate .cell{font-size:clamp(13px,3vw,24px)}.gomoku .cell{font-size:clamp(10px,2.6vw,16px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}