:root{--fp-bg:#17181e;--fp-dark:#111217;--fp-panel:#272932;--fp-line:#424651;--fp-accent:#B33780;--fp-blue:#43adf2;--fp-muted:#afb4bf}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif}body.fp-body{background:var(--fp-dark);color:#fff}button,input,select,textarea{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.fp-app{height:100dvh;min-height:380px;display:flex;flex-direction:column;overflow:hidden}.fp-topbar{height:58px;flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;background:#0c0c0e;border-bottom:1px solid #303039;padding:0 20px;z-index:10}.fp-topbar h1{margin:0;font-size:16px;letter-spacing:.04em}.fp-close{justify-self:start;color:#fff;text-decoration:none;border:1px solid #686a74;border-radius:8px;padding:10px 12px;font-size:13px}.fp-next{justify-self:end;padding:9px 22px;border:0;border-radius:7px;font-size:14px;font-weight:700;background:var(--fp-accent);color:#171717}.fp-next:disabled{opacity:.45;cursor:not-allowed}
.fp-topbar-spacer{min-width:70px;justify-self:end}
.fp-create-bar{grid-column:2;grid-row:2;display:flex;justify-content:center;align-items:center;padding:11px 16px;background:var(--fp-panel);border-left:1px solid var(--fp-line);border-top:1px solid var(--fp-line)}
.fp-create-bar .fp-next{width:100%;min-height:46px;background:var(--fp-accent);color:#151515;font-weight:800;border-radius:10px}

.fp-result .fp-result-share.fp-primary{background:var(--fp-accent);border:0;color:#151515;font-weight:800}
.fp-result .fp-result-share[hidden]{display:none!important}
.fp-result .fp-primary[hidden]{display:none!important}.fp-editor{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:minmax(0,1fr) auto 66px;background:var(--fp-bg)}.fp-stage{grid-column:1;grid-row:1/4;position:relative;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:18px 15px 34px;background:#1c1d23;overflow:hidden}.fp-wrap{position:relative;flex:none;line-height:0;box-shadow:0 5px 28px #0007;background:#383b44;touch-action:none;user-select:none;-webkit-user-select:none}.fp-wrap canvas#fpCanvas{display:block;width:100%;height:100%;object-fit:fill;touch-action:none}.fp-status{position:absolute;bottom:5px;left:12px;right:12px;font-size:12px;text-align:center;color:#cbd0da;pointer-events:none;margin:0;line-height:1.5}.fp-selection{position:absolute;box-shadow:inset 0 0 0 2px var(--fp-blue);outline:1px dashed #fff9;pointer-events:none;z-index:2}.fp-handle{pointer-events:auto;position:absolute;width:24px;height:24px;border:2px solid #198add;border-radius:5px;background:#fff;touch-action:none;outline-offset:3px;padding:0}.fp-handle-nw{top:0;left:0;transform:translate(-50%,-50%);cursor:nwse-resize}.fp-handle-ne{top:0;right:0;transform:translate(50%,-50%);cursor:nesw-resize}.fp-handle-sw{bottom:0;left:0;transform:translate(-50%,50%);cursor:nesw-resize}.fp-handle-se{bottom:0;right:0;transform:translate(50%,50%);cursor:nwse-resize}.fp-panel{grid-column:2;grid-row:1;min-height:0;background:var(--fp-panel);border-left:1px solid var(--fp-line);overflow:hidden;display:flex;flex-direction:column}.fp-panel-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--fp-line);padding:13px 16px;flex:none}.fp-panel-heading h2{margin:0;font-size:16px}.fp-panel-heading button{border:1px solid #757884;color:#fff;background:#474954;border-radius:8px;padding:8px 12px}.fp-panel-content{overflow-y:auto;overscroll-behavior:contain;padding:18px 18px 28px;min-height:0}.fp-pane>p{font-size:13px;line-height:1.7;color:#d3d5dc;margin:0 0 17px}.fp-pane .fp-note{color:var(--fp-muted);font-size:12px;margin:10px 0 15px}.fp-primary{display:flex;align-items:center;justify-content:center;min-height:47px;width:100%;border:0;border-radius:10px;background:var(--fp-accent);color:#111;text-decoration:none;font-weight:800;padding:10px;cursor:pointer}.fp-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid #777a85;color:#fff;border-radius:8px;background:#464852;padding:9px 13px;text-decoration:none;font-size:13px}.fp-pane .fp-secondary{margin:7px 0 13px;max-width:100%}.fp-label{display:block;font-size:13px;font-weight:700;margin:19px 0 9px;color:#fff}.fp-pane input[type=range]{width:100%;accent-color:var(--fp-accent);cursor:pointer}.fp-select,.fp-pane textarea{width:100%;border:1px solid #6b6d78;border-radius:8px;padding:12px;color:#fff;background:#393b46;outline-offset:2px}.fp-pane textarea{resize:vertical;min-height:74px}.fp-bubbles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.fp-bubble-choice{min-height:77px;position:relative;background:#3a3c48;border:1px solid #656873;border-radius:7px;padding:4px 2px 14px;color:#ddd}.fp-bubble-choice canvas{width:100%;max-height:51px;height:auto;display:block}.fp-bubble-choice span:last-child:not(.fp-bubble-none){position:absolute;bottom:2px;left:0;right:0;font-size:10px}.fp-bubble-choice .fp-bubble-none{font-weight:700;font-size:14px}.fp-bubble-choice.is-active{border:2px solid var(--fp-accent);background:#60503d;padding:3px 1px 13px}.fp-toolbar{grid-column:2;grid-row:3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#14151a;border-top:1px solid #35363f;min-height:66px}.fp-tool{min-width:0;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;background:none;color:#ccc;border:0;font-size:11px}.fp-tool svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.fp-tool.is-active{color:var(--fp-accent);background:#29231d}.fp-result{flex:1;min-height:0;overflow-y:auto;text-align:center;padding:18px 18px 40px;background:#191a20}.fp-result-header{max-width:680px;margin:0 auto 12px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px}.fp-result-header #fpResultBack{grid-column:1;justify-self:start;white-space:nowrap}.fp-result-header h2{grid-column:2;text-align:center}.fp-result-header h2{margin:0;font-size:17px}.fp-result p{font-size:13px;color:#d9dce5;line-height:1.6}.fp-result img{display:block;max-width:100%;max-height:60dvh;width:auto;height:auto;margin:16px auto 20px;object-fit:contain;box-shadow:0 3px 24px #0007}
@media(min-width:781px){.fp-panel[hidden]{display:flex!important;visibility:hidden}.fp-editor:has(.fp-panel[hidden]){grid-template-columns:minmax(0,1fr) 340px}.fp-pane[hidden]{display:none!important}}
@media(max-width:780px){.fp-app{height:100dvh;min-height:320px}.fp-topbar{height:51px;padding:0 12px}.fp-topbar h1{font-size:15px}.fp-close{padding:8px 10px;font-size:12px}.fp-next{padding:9px 15px}.fp-editor{display:flex;flex-direction:column;min-height:0;position:relative}.fp-stage{flex:1;min-height:0;grid-column:auto;grid-row:auto;padding:12px 12px 24px}.fp-status{bottom:2px;font-size:11px}.fp-panel{grid-column:auto;grid-row:auto;flex:0 0 auto;max-height:min(43dvh,360px);border-left:0;border-top:1px solid var(--fp-line);overflow:hidden}.fp-panel-heading{padding:9px 13px}.fp-panel-content{padding:13px 15px 20px}.fp-create-bar{grid-column:auto;grid-row:auto;flex:0 0 auto;padding:8px 12px;background:#1c1d23;border-left:0;border-top:1px solid #363843}
.fp-create-bar .fp-next{min-height:43px;padding:10px 16px}
.fp-toolbar{grid-column:auto;grid-row:auto;min-height:65px;flex:0 0 65px;padding-bottom:env(safe-area-inset-bottom);box-sizing:content-box}.fp-handle{width:28px;height:28px}.fp-result img{max-height:57dvh}}

/* Photo privacy mosaic: selected region uses the same four-corner handles. */
.fp-selection.is-blur{border-radius:50%;box-shadow:inset 0 0 0 2px var(--fp-blue);outline:none}
.fp-blur-items{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.fp-blur-item{border:1px solid #696d7c;color:#eee;background:#414450;min-height:39px;padding:8px 11px;border-radius:8px;font-size:13px}
.fp-blur-item.is-active{border-color:var(--fp-accent);box-shadow:inset 0 0 0 1px var(--fp-accent);background:#60503d}
.fp-blur-item:focus-visible{outline:2px solid white;outline-offset:2px}
.fp-pane .fp-danger{color:#ffe0d9;border-color:#97655f}
.fp-pane #fpAddBlur:disabled{cursor:default;opacity:.5}

/* v4: Finished-image actions are one centered group. Primary action first,
   secondary action below, including narrow viewports and iOS Share Sheet. */
.fp-result-actions{
  width:100%;max-width:500px;margin:22px auto 0;
  display:flex;flex-direction:column;align-items:stretch;gap:10px;
}
.fp-result .fp-result-actions > #fpDownload,
.fp-result .fp-result-actions > #fpShare{
  display:flex;align-items:center;justify-content:center;
  box-sizing:border-box;width:100%;max-width:none;min-width:0;
  margin:0;position:static;left:auto;right:auto;transform:none;
  text-align:center;white-space:normal;
}
.fp-result .fp-result-actions > #fpDownload{
  min-height:50px;background:var(--fp-accent);color:#151515;
  font-size:15px;font-weight:800;border:0;border-radius:10px;
}
.fp-result .fp-result-actions > #fpShare.fp-secondary{
  min-height:44px;background:#373943;color:#f2f2f5;
  border:1px solid #666973;border-radius:9px;font-size:13px;font-weight:600;
}
.fp-result .fp-result-actions > #fpShare.fp-primary{
  min-height:50px;background:var(--fp-accent);color:#151515;
  border:0;border-radius:10px;font-size:15px;font-weight:800;
}
.fp-result .fp-result-actions > [hidden]{display:none!important}
.fp-result-actions > :focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(max-width:780px){
  .fp-result-actions{margin-top:17px;gap:9px}
  .fp-result .fp-result-actions > #fpDownload,
  .fp-result .fp-result-actions > #fpShare.fp-primary{min-height:48px}
}

/* LineFace: quiet white-line messaging, no opaque comic bubble fill. */
.fp-topbar{background:#B33780;border-bottom-color:#832158}
.fp-bubble-choice{background:#24262d;border-color:#555867}
.fp-bubble-choice.is-active{background:#4b3345;border-color:#d28bb2}
.fp-tool.is-active{background:#30222d;color:#f0b8d7}
.fp-create-bar .fp-next,.fp-primary,.fp-result .fp-result-actions > #fpDownload{color:#fff!important}
.fp-panel .fp-note{line-height:1.7}
.fp-bubble-choice .fp-bubble-none{font-size:12px;white-space:nowrap}

/* LineFace v18: on desktop the tool panel is always open, so "Done" is unnecessary.
   Keep the button on mobile where users intentionally close the panel. */
@media (min-width:781px){
  .fp-panel-heading #fpPanelDone{display:none!important}
}
