@charset "utf-8";@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap);.sidebar-content a,.site-title .title,body,body a{color:var(--color-text)}*,.memo-textarea,::after,::before{box-sizing:border-box}.main-footer ul li,.todo-list{list-style:none}#overlay,.sidebar{top:0;left:0;z-index:100}#overlay,.sidebar-icon.close,.sidebar-toggle[aria-expanded=true] .open{display:none}:root{--color-main:#67C56F;--color-sub:#EAF6EC;--color-accent:#F5C7D3;--color-base:#FFFFFF;--color-text:#2E2E2E;--color-line:#D8E3DA;--color-line2:#eee;--color-nav:#F7F7F7;--color-gray1:#555555;--color-gray2:#7f8c8d;--color-gray3:#95a5a6;--color-gray4:#f8f9fa;--color-red:#E57373;--color-blue:#0071e3;--color-main-hover:color-mix(in srgb, var(--color-main), black 10%);--color-main-active:color-mix(in srgb, var(--color-main), black 20%);--color-red-hover:color-mix(in srgb, var(--color-red), black 10%);--color-red-active:color-mix(in srgb, var(--color-red), black 20%);--color-gray3-hover:color-mix(in srgb, var(--color-gray3), black 10%);--color-gray3-active:color-mix(in srgb, var(--color-gray3), black 20%);--color-main-tint:color-mix(in srgb, var(--color-main), white 80%);--body-font-family:font-family: system-ui,-apple-system,"Noto Sans JP",sans-serif;--fs-base:1rem;--fs-sm:0.875rem;--fs-lg:1.125rem;--fs-xl:1.25rem;--header-height:80px;--nav-width:360px;--nav-width-pc:250px;--footer-height:80px;--content-max-width:1240px;--radius-main:12px;--shadow-main:0 12px 20px rgb(0 0 0 / 0.08);--radius-card:24px;--radius-card2:16px;--shadow-card:0 10px 30px rgb(0 0 0 / 0.08);--card-bg:#ffffff;--state-idle:#f5f5f7;--state-prep:#f5f0ff;--state-work:#e3f2fd;--state-interval:#fff4e5}body{margin:0;background:var(--color-base);font-family:var(--body-font-family);font-size:var(--fs-base);line-height:2;-webkit-font-smoothing:antialiased}body a{text-decoration:none}.page-wrapper{display:flex;flex-direction:column;min-height:100vh;align-items:center;padding:16px;background:linear-gradient(180deg,rgba(234,246,236,.8) 0,rgba(255,255,255,0) 30%)}.site-shell{width:100%;max-width:var(--content-max-width);background:var(--color-base);border:1px solid var(--color-line);border-radius:12px;box-shadow:0 6px 18px rgba(46,46,46,.06);overflow:hidden;min-height:90vh}.main-header{position:sticky;top:0;height:var(--header-height);display:flex;justify-content:space-between;align-items:center;background:linear-gradient(90deg,var(--color-base),var(--color-sub));border-bottom:solid 1px var(--color-line);padding:0 12px}.site-brand,.site-title-link{align-items:center;display:flex}.sidebar-toggle{background:0 0;border:none;cursor:pointer;outline:0;transition:background .2s;padding:6px clamp(3px,.3529px + .7353vw,6px);color:#777}.sidebar-toggle:focus-visible{background-color:rgba(0,0,0,.05)}.sidebar-toggle:hover{background-color:rgba(0,0,0,.1)}.sidebar-toggle img{width:28px;height:28px}.sidebar-toggle[aria-expanded=true] .close{display:block}.sidebar-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4)}.site-brand{font-size:1.1em;line-height:1.5}.site-title-link{gap:clamp(4px,3.2174px + .2174vw,6px)}.site-brand .logo{width:32px;height:auto}.site-title .title{font-weight:700;font-size:clamp(1rem, .9511rem + .2174vw, 1.125rem)}.site-title .muted{font-size:12px;color:#6b6b6b;margin-left:2px}.header-actions{display:flex;align-items:center}.header-actions .btn{font-size:var(--fs-sm);padding:10px clamp(2px,-5.8261px + 2.1739vw,22px)}.sidebar{position:fixed;width:var(--nav-width);height:100vh;background:var(--color-nav);padding:24px;overflow:auto;transform:translateX(-100%);transition:.3s}.sidebar.is-open{transform:translateX(0)}.sidebar-content{display:flex;flex-direction:column;gap:8px;margin-top:8px}.sidebar-content a{display:block;padding:10px 12px;border-radius:8px;transition:background .15s,transform .08s;font-weight:600}.sidebar-content a:hover{background:var(--color-sub);transform:translateX(4px)}.site-main{padding:2.5em 1.5em;min-height:73vh}.main-footer{padding:1em;display:flex;flex-direction:column;align-items:center;height:var(--footer-height);font-size:13px;border-top:1px solid var(--color-line)}.main-footer ul{display:flex;gap:1em;margin:0;padding:0}.main-footer ul li a:hover{text-decoration:underline;text-underline-offset:4px}.app-icon,.home-container .app-icon{width:48px;height:48px;stroke:#67C56F;fill:none}.card{max-width:500px;margin:clamp(1rem,.4035rem + 2.4471vw,2.3rem) auto 0;padding:clamp(2rem,1.6087rem + 1.7391vw,3rem) clamp(1.5rem,.9953rem + 2.0706vw,2.6rem);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.box-green{margin:2rem 0;padding:1em;border-radius:10px;background:var(--color-sub);border:1px solid var(--color-line)}.btn{background-color:var(--color-main);color:#fff;font-weight:700;text-align:center;padding:1em 1.6em;border:none;border-radius:8px;cursor:pointer;box-shadow:1px 3px 5px rgb(0 0 0 / .28);transition:.2s;min-width:5.6rem}.btn:hover{background-color:var(--color-main-hover)}.btn:active{background-color:var(--color-main-active);transform:translateY(3px);box-shadow:0 1px 1px rgb(0 0 0 / .28)}h1{font-size:clamp(1.4rem, 1.3082rem + .3765vw, 1.6rem);margin:0}h2{font-size:clamp(1.2rem, 1.1082rem + .3765vw, 1.4rem)}a{text-underline-offset:4px}.small{font-size:var(--fs-sm)}.large{font-size:var(--fs-lg)}.xlarge{font-size:var(--fs-xl)}.app-desc,.note{font-size:var(--fs-sm)}.note{margin:2rem 0;color:#666}.app-header{display:flex;align-items:center;gap:.8em;margin-bottom:0}.app-desc{color:var(--color-gray2);margin:.4rem .3rem 0 0}@media print,screen and (min-width:769px){.page-wrapper{height:100vh;height:100dvh}.sidebar{position:static;transform:none;width:var(--nav-width-pc);height:100%;border-right:1px solid #ddd}.sidebar .site-brand,.sidebar-overlay,.sidebar-toggle{display:none}.site-shell{display:grid;height:100%;overflow:hidden;grid-template-rows:var(--header-height) 1fr var(--footer-height);grid-template-columns:var(--nav-width-pc) 1fr;grid-template-areas:"header header" "side   main" "footer footer"}.site-header{grid-area:header}.site-sidebar{grid-area:side;overflow-y:auto}.site-main{grid-area:main;overflow-y:auto;-webkit-overflow-scrolling:touch}.site-footer{grid-area:footer}.app-desc{display:flex;align-items:center;justify-content:space-between}}.app-desc a{display:block;text-align:right}.app-icon{background:var(--color-sub);border-radius:12px;display:flex;align-items:center;justify-content:center;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;padding:4px}.app-container{max-width:600px;margin:0 auto}.usage-guide{margin-top:5rem;font-size:.95rem;line-height:1.7;color:var(--color-gray1)}.usage-title{font-size:1rem;margin:2rem 0 .5rem}.usage-guide ol{padding-left:2em;margin:0}.usage-guide>ol>li{font-size:.9rem;font-weight:700;margin-bottom:16px}.usage-guide ul{margin:4px 0 0;padding-left:1.2rem;font-weight:400}.usage-guide ul li{margin-bottom:6px;list-style-type:disc}.usage-note{margin:20px 0 0 10px;font-size:.9rem;color:#777}.home-container{max-width:900px;margin:auto}.home-container .welcome-title{text-align:center;margin-bottom:2rem}.home-container .app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}.home-container .app-card{background:#fff;border:1px solid var(--color-line2);border-radius:var(--radius-card2);padding:24px;text-align:left;cursor:pointer;transition:.3s;display:flex;flex-direction:column;align-items:flex-start;color:inherit}.counter-item,.input-row input,.timer-screen,.todo-title{text-align:center}.home-container .app-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-card);border-color:var(--color-main)}.home-container .app-icon{stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.home-container .app-card:hover .app-icon{stroke:#4fae58}.home-container .icon-circle{width:50px;height:50px;background:var(--color-sub);border-radius:var(--radius-main);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:16px}.home-container .app-title{font-weight:700;font-size:1.1rem;margin-bottom:8px}.input-group label,.input-row .unit-label{font-weight:600;font-size:.8rem;color:var(--color-gray2)}.home-container .app-desc{font-size:.85rem;color:var(--color-gray2);line-height:1.4}.timer-screen{background:var(--state-idle);border:2px solid transparent;border-radius:20px;padding:30px 20px;transition:background-color .5s;display:flex;flex-direction:column;justify-content:center;align-items:center}.app-timer-simple .timer-screen{padding:clamp(2.375rem,1.8875rem + 2vw,3.4375rem) 20px}.timer-screen.is-prep{background-color:var(--state-prep);background:#f5f0ff;border-color:#af52de}.timer-screen.is-work{background-color:var(--state-work);border-color:var(--color-blue)}.timer-screen.is-interval{background-color:var(--state-interval);border-color:#ff9500}.timer-display-main{font-size:4.5rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1;margin:10px 0}.timer-label-sub{font-size:1rem;font-weight:700;color:var(--color-blue);margin-bottom:8px}.timer-status-info{font-size:1.1rem;font-weight:500;color:#86868b}.controls-grid{display:grid;grid-template-columns:1fr 2fr;gap:15px;margin:15px 0 24px}.button-group,.mute-toggle{margin-top:24px;display:flex}.input-group label{display:block;margin-bottom:6px;margin-left:4px}.input-group .input-row{display:flex;align-items:center;gap:4px;background:#f5f5f7;padding:8px 12px;border-radius:12px;flex:1}.input-row input{width:100%;border:none;background:0 0;font-size:1.1rem;font-weight:600;outline:0}.input-row-flex{display:flex;gap:6px}.button-group{gap:10px}.app-container .btn{flex:1;font-size:clamp(.9rem, .7826rem + .5217vw, 1.2rem);border-radius:16px;padding:clamp(.875rem,.7259rem + .6118vw,1.2rem) 0}.btn-copy,.btn-start{background-color:var(--color-main)}.btn-stop{background-color:var(--color-red)}.btn-stop:hover{background-color:var(--color-red-hover)}.btn-stop:active{background-color:var(--color-red-active)}.btn-clear,.btn-reset{background-color:var(--color-gray3)}.btn-clear:hover,.btn-reset:hover{background-color:var(--color-gray3-hover)}.btn-clear:active,.btn-reset:active{background-color:var(--color-gray3-active)}.mute-toggle{align-items:center;justify-content:center;gap:8px;font-size:.9rem;color:var(--color-gray2);cursor:pointer}.counter-input{width:100%;height:150px;padding:10px;border:1px solid #ccc;border-radius:8px;font-size:1rem;resize:vertical;min-height:100px}.counter-stats{margin-top:15px;display:flex;justify-content:space-around;background:#f0f2f5;padding:10px;border-radius:8px}.counter-label{font-size:.8rem;color:#666}.counter-value{font-size:1.5rem;font-weight:700}.counter-value--total{color:var(--color-blue)}.counter-value--no-space{color:var(--color-main)}@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(30px)}}.todo-title{margin:0 0 20px;font-size:1.25rem}.todo-input-group{display:flex;gap:8px;margin-bottom:15px}.todo-input{flex:1;min-width:0;padding:clamp(8px,.5rem + 1vw,16px);font-size:clamp(14px, .8rem + .5vw, 18px);border:1px solid #ddd;border-radius:8px;outline:0}.todo-add-button{padding:10px 15px;background:#28a745;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:700;white-space:nowrap}.todo-item,.todo-status-bar{border-bottom:1px solid #eee;display:flex}.todo-status-bar{justify-content:space-between;font-size:.85rem;color:#666;padding-bottom:10px}.todo-clear-all{cursor:pointer;color:#dc3545;text-decoration:underline}.todo-list{padding:0;margin:0}.todo-item{align-items:center;justify-content:space-between;padding:12px 5px;animation:.3s ease-out slideIn}.todo-item.is-deleting{animation:.3s ease-in forwards fadeOut}.todo-item-label{display:flex;align-items:center;gap:10px;cursor:pointer;flex:1}.todo-item-text.is-completed{color:#bbb;text-decoration:line-through}.todo-delete-button{background:0 0;border:none;color:#ffbcbc;cursor:pointer;font-size:1.2rem;padding:4px}.memo-status-text,.typing-header{color:var(--color-main);font-weight:700}.memo-status-area{height:20px;margin-bottom:5px;text-align:right}.memo-status-text{font-size:.75rem;opacity:0;transition:opacity .5s}.memo-status-text.is-visible{opacity:1}.memo-textarea{width:100%;height:clamp(200px,180.4348px + 5.4348vw,250px);padding:15px;border:1px solid #ddd;border-radius:10px;outline:0;font-size:1rem;line-height:1.6;resize:vertical;transition:border-color .2s}.memo-textarea:focus{border-color:var(--color-blue)}.app-typing-simple .card{text-align:center;max-width:600px}.typing-header{margin-bottom:10px}.typing-kanji{font-size:clamp(2.2rem, 1.9652rem + 1.0435vw, 2.8rem);font-weight:700;margin-bottom:20px}.typing-display{font-family:Consolas,Monaco,monospace;font-size:clamp(1.5rem, 1.3043rem + .8696vw, 2rem);letter-spacing:.1rem;padding:25px 2px;background:var(--color-gray4);border-radius:12px;min-height:1.5em;margin-bottom:15px}#player,.enemy{font-size:3rem;position:absolute}.typing-display--typed{color:#dee2e6}.typing-display--current{color:var(--color-main);border-bottom:3px solid var(--color-main)}.typing-display--rest{color:var(--color-gray1)}.typing-hint{color:var(--color-gray2);margin-bottom:30px}.typing-result-ui{padding:20px}.app-container .typing-btn{padding:12px 40px;margin-top:1rem}.typing-usage-guide{margin-top:40px;text-align:left;padding-top:30px}.typing-usage-guide h3{font-size:1.2rem;margin-bottom:15px}.typing-usage-guide .step-title{display:block;font-weight:700;margin-top:15px}.typing-usage-guide ul{list-style:none;padding-left:0;margin:5px 0}.typing-usage-guide ul li::before{content:"・"}#game-container{width:100%;max-width:500px;height:600px;margin:20px auto;background:#0b0e14;position:relative;overflow:hidden;border:4px solid #333;border-radius:15px;font-family:'Courier New',Courier,monospace}.enemy{width:100%;text-align:center;transition:top .1s linear;z-index:10}.enemy-word{display:block;font-size:1.2rem;color:#fff;background:rgba(0,0,0,.6);padding:2px 10px;border-radius:5px;margin-top:5px}#player{bottom:20px;left:50%;transform:translateX(-50%)}.bullet{position:absolute;font-size:1.5rem;z-index:5;transition:bottom .3s ease-in}#overlay{position:absolute;width:100%;height:100%;background:rgba(0,0,0,.8);color:red;flex-direction:column;justify-content:center;align-items:center}